1

I would like to append the browser url based on the view enabled in the same page.

Default URL: http://localhost:4200/xxx/disciplines

On click on the table row it will update like URL: http://localhost:4200/xxx/disciplines?disciplineId=1100

onRowClicked(event: any) {
    this.isRowSelected = true;
    this.selectedId = event.data.id; //event.id;
    this.selectedItem = event;
    console.log(this.selectedItem);
    this.dataService.set(event);
    this.router.navigate([], { queryParams: { disciplineId: this.selectedId } });

  }

  1. Can not we update the selected ID automatically without using this.router.navigate([], { queryParams: { disciplineId: this.selectedId } });

  2. How to append the new value like http://localhost:4200/xxx/disciplines?disciplineId=1100&disciplineView=create on clicking on some button.

If I use this this.router.navigate([], { queryParams: { disciplineView: view } });

url changed to

http://localhost:4200/xxx/disciplines?disciplineView=create

instead

http://localhost:4200/xxx/disciplines?disciplineId=1100&disciplineView=create

Expert advise please?

klmuralimohan
  • 861
  • 4
  • 23
  • 44
  • 1
    Possible duplicate of [Angular 2 updating URL path params with no redirect](https://stackoverflow.com/questions/48787379/angular-2-updating-url-path-params-with-no-redirect) – Prashant Pimpale Jun 17 '19 at 04:53
  • If I get your question right, On first click of the button, you need `http://localhost:4200/xxx/disciplines?disciplineId=1100` and on the second click of the same button you need `http://localhost:4200/xxx/disciplines?disciplineId=1100&disciplineView=create`? – KiraAG Jun 17 '19 at 04:55
  • If you want the above, you should use `queryParamsHandling: "merge"` . like this: `this.router.navigate([], { queryParams: { disciplineView: view }, queryParamsHandling: "merge" });` – KiraAG Jun 17 '19 at 04:57
  • Check this link for more [info](https://angular.io/api/router/NavigationExtras#queryParamsHandling). – KiraAG Jun 17 '19 at 04:58
  • @KiraAG: No, While clicking the table row item url needs to update based on the selected item like "http://localhost:4200/xxx/disciplines?disciplineId=1100". While clicking the create button outside the table url needs to be 'http://localhost:4200/xxx/disciplines?disciplineId=1100&disciplineView=create' – klmuralimohan Jun 17 '19 at 04:59
  • 1
    Ok you can follow my option on using `queryParamsHandling: "merge"` above. – KiraAG Jun 17 '19 at 05:00

1 Answers1

0

You should use queryParamsHandling: "merge" . like this: this.router.navigate([], { queryParams: { disciplineView: view }, queryParamsHandling: "merge" });

So this will merge your new params to the existing activated route.

KiraAG
  • 773
  • 4
  • 19