Angular 2：如何在md-list-item中传递路由器？

我使用md-nav-list填充对象列表。当用户点击一个md-list-item时，我想导航到候选细节路由器并通过candidate.id。不知道如何拨打路由器md-list-item。Angular 2：如何在md-list-item中传递路由器？

<md-nav-list *ngFor="let candidate of candidates"> 
    <md-list-item class="candidate-row"> 
     <div class="column2"> 
     <span class="name">{{candidate.name}},</span> 
     </div> 
    </md-list-item> 
    </md-nav-list>

路由器候选的细节是
{path: 'candidate/:id', component: CandidateDetailsComponent}

代码休息时可以在这里 https://github.com/himanshuy/hiringplus-ui/tree/page2

来源

2017-01-10 Himanshu Yadav

可以传递ID与routerLink如下图所示：

<md-list-item class="candidate-row" [routerLink]="['candidate',{id:candidate.id}]"> 
     ... 
</md-list-item>

候选细节的路由器是

{path: 'candidate/:id', component: CandidateDetailsComponent}

来源

2017-01-10 09:07:40 Darshita

发现你可以使用routerLink指令来形成URL

<a class="name" [routerLink]="['candidate', candidate.id]"> 
    {{candidate.name}}, 
</a>

来源

2017-01-10 04:28:09

整个''是一个链接。需要在行级别指定某些内容。 –

然后将其应用于'md-list-item'元素 –

你可以将routerLink指令添加到md-list-item组件已废除（或任何其它组分）：

<md-list-item class="candidate-row" [routerLink]="['candidate', candidate.id]"> 
    ... 
</md-list-item>

来源

2017-01-10 04:55:57 ironmanwaring

Angular 2：如何在md-list-item中传递路由器？

回答

相关问题