Search code examples
angularangular-router

Angular routing conflict with param vs

I have two url definitions in angular routing.

http://localhost:4200/user/:id/:mode -> component1 and http://localhost:4200/user/:id/preview -> component2

If I call http://localhost:4200/user/1/edit or http://localhost:4200/user/1/view it will open the component1 with the given id and the given mode param. Thats fine so far.

But if I call http://localhost:4200/user/1/preview I want to go to component2. But the routing module routes me to component1 with mode 'preview'.

So any suggestions how I can solve such routing conflicts?

br

Solution

  • it's related to the order, move preview before :mode

    children: [
 { path: 'preview', component: component2},
 { path: ':mode', component: component1},
]