CODEWITHSUNDEEP
angularangular2-routing
Protagonist
Protagonist

Reputation: 1669

Angular 2: How to provide interpolation with [routerLink]

I have routing defined in routing.ts file in this way.

const routesapp: Routes= [
{path:'user/id', component:UserComponent}
];
export const:routing ModuleWithProviders = RouterModule.forRoot(routesapp, {useHash:true});

and in HTML

<li class ="Some class">
    <a href= "#/user/{{id}}"> Link </a>
</li>

How do I convert this to work with [routerLink]? From previous posts I learnt that we cannot add interpolation with [routerLink], i.e [routerLink] = ['user/{{id}}']

I want to add interpolation in HTML only and I cannot add it in routing file. Also, How to override useHash of routing file in HTML?

Upvotes: 18

Views: 11665

Answers (2)

LBarton
LBarton

Reputation: 31

This router link worked for me [routerLink]="['/edit', element.ID]"

I used it in the following:

<a href="javascript: void(0);" [routerLink]="['/edit', element.ID]" 
routerLinkActive="router-link-active" > {{ element.RequesterName }}</a>

Thanks!

Upvotes: 3

Tiep Phan
Tiep Phan

Reputation: 12596

try this

<li class ="Some class">
    <a [routerLink]="['user', idVariable]">Link </a>
</li>

Upvotes: 33

Related Questions