Updating parameters in route Angular

Question

I have a route with two parameters in it and Im trying to update it (just the url, forget about the content of the component, also I dont want to refresh the page or anything, just update the route) but I cant do that. My routing:

const routes: Routes = [
{ path: "levs", component: MainComponent },
{ path: "levs/:levType", component: LevDetailsComponent },
{ path: "levs/:levType/:levId", component: EntityDetailsComponent }
];

So when Im in EntityDetailsComponent and my url is: levs/someLev/someLevId I have a list of other entities. When clicked, I want to update the url like this: levs/clickedLev/clickedLevId. I tried to do it from html with router link:

<li [routerLink]="[type.entityType, type.entityName]">lev</li>

or

<li [routerLink]="['/levs', type.entityType, type.entityName]">lev</li>

but in both cases it seems to be addding it to existing route like this: levs/someLev/someLevId/levs/clickedLev/clickedLevId I tried from EntityDetailsComponent.ts with router:

this.router.navigate('/levs',[this.entityType, this.entityIdentifier]);

And also without levs before parameters but the result is the same.

I found this solution: Update routeparams in angular 5

but these guys, they are just adding numbers to the route, I dont want to increment my parameters but change them, their approach doesnt work for me. Any help would be appreciated!

SOLUTION Thanks @armandyjoe for help. This worked for me, I just had to adjust passed url and use replaceURL true.

this.router.navigate(["/dct/levs/", this.entityType, this.entityIdentifier], { replaceUrl: true });

armandyjoe · Accepted Answer · 2019-10-25 13:36:31Z

2

this.router.navigate(['/yoururl'], { queryParams: { type: someVariable, entity: someVariable } });

Hope this help!

Regards

answered Oct 25, 2019 at 13:36

armandyjoe

1232 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

MWPodgorni Over a year ago

But what 'yoururl'? the whole url?

armandyjoe Over a year ago

Oh you don't want parameters. Now I've seen that you wanted to just create a full new URL like 'levs/clickedLev/clickedLevId'. In this case you could just use: this.location.replaceState('levs/clickedLev/clickedLevId');

MWPodgorni Over a year ago

I do want to update two parameters, but I already have them in the ts file, so I just dont know how to use router to replace them. Could you provide an example? I cant figure it out, even with the replaceUrl property it still shows the same problem

armandyjoe Over a year ago

Please checkout jeffryhouser.com/index.cfm/2019/4/23/…

MWPodgorni Over a year ago

I solved it and added solution to the question. Thanks for help!

Collectives™ on Stack Overflow

Updating parameters in route Angular

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related