CODEWITHSUNDEEP
angularangular-routing
Rookian
Rookian

Reputation: 20549

Is it possible to update one defined router parameter?

The standard way to navigate to a route is

this.router.navigate(["/details", "30"]

with the following route configuration:

{ path: "details/:id", component: TestRouteComponent }

The constructor of my class would be

constructor(private router: Router, private route: ActivatedRoute) { }

What I want to do is to just update the id of the current route.

Something like

this.route.params.id = 10;

and then navigate to that route

this.router.navigate(this.route);

Is that possible with angular routing?

Upvotes: 1

Views: 93

Answers (2)

Gregor Woiwode
Gregor Woiwode

Reputation: 1164

Am I right, that you want to react on changes inside a component when the params of its route has changed?

When yes, you do not want to trigger a new navigation. You simply subscribe to changes of params.

 constructor(private route: ActivatedRoute) {
   this.route.params.subscribe(params => {
      /* access updated params and trigger further actions */
  }
}

Now if you have multiple links (e.g. routerLink) pointing to your component having just different parameters the router will detect that no new route has to be activated. Therefore you cann subscribe to params or paramMap.

paramMap gives you more control accessing certain parameters of the route.

Upvotes: 0

Gregor Woiwode
Gregor Woiwode

Reputation: 1164

You cannot manipulate params since this is an Observable. You can do something like this:

router.navigate(['..', 2], { relativeTo: route });

The two dots are indicating that you move one level up.

from `welcome/1` to `welcome`

After that your param is appended to the route.

But I wonder if there is a nicer way to do a simple change of the parameter.

Upvotes: 2

Related Questions