CODEWITHSUNDEEP
javascriptangularjsangularangular2-routingangular2-router3
Netwraith
Netwraith

Reputation: 11

Angular 2 Routing - Router RC3

I'm trying to navigate to a page using a routerLink after getting an id, which I can get.

The problem is the link is showing up as '/page;id=10/component'. I would like for it to show as '/page/10/component' (not matrix notation - no ';id=' )

In my app.routes.ts:

@RouterConfig = [
    { path: 'page/:id/component', component: MyComponent, data: {id: 'item.id'} }
];

In my page:

<a [routerLink]="['page', {id: item.id}, 'component']">

I'm using the latest Angular 2 Router component (RC3 Beta 2).

Anyone know what I'm doing wrong? Thanks in advance.

Upvotes: 1

Views: 267

Answers (3)

after-ephemera
after-ephemera

Reputation: 371

From what I can see, this route configuration doesn't work:

{ path: 'page/:id/component', component: MyComponent, data: {id: 'item.id'} }

I think what you really need to ask is if the final '/component' is necessary. If it is, you might want to consider adding a child route.

Another option would be to alter the order of your route, using page/component/:id instead. I believe the routerlink directive appends your URL search parameters to the end of the route, so this should work.

Again, the easiest solution would be to just remove '/component' from the route configuration.

Upvotes: 0

Yhlas
Yhlas

Reputation: 421

This should be: 

<a [routerLink]="['page', {'id': item.id}, 'component']">

instead of: 

<a [routerLink]="['/page', item.id, 'component']">

Upvotes: 1

Arpit Agarwal
Arpit Agarwal

Reputation: 4013

Try this 

<a [routerLink]="['page', item?.id, 'component']">

Upvotes: 0

Related Questions