2016-10-19 127 views
0

我有多个命名的outlet和routerLinks来为Angular2组件中的其他组件提供出口。强制RouterLink不要更改Angular 2中的href

<p><a [routerLink]="['1/1', {outlets: {'articlesOutlet1': ['article'],'articlesOutlet2': ['news'] }}]"> Provide outlets 1/1</a></p> 
<p><a [routerLink]="['1/2', {outlets: {'articlesOutlet1': ['article'],'articlesOutlet2': ['news'] }}]"> Provide outlets 1/2</a></p> 
<p><a [routerLink]="['1/3', {outlets: {'articlesOutlet1': ['article'],'articlesOutlet2': ['news'] }}]"> Provide outlets 1/3</a></p> 
<div class="flex-container"> 
    <div class="flex-item"><router-outlet></router-outlet></div> 
    <div class="flex-item"><router-outlet name="articlesOutlet1"></router-outlet></div> 
    <div class="flex-item"><router-outlet name="articlesOutlet2"></router-outlet></div> 
</div> 

当应用程序启动的第一个链接的hrefbecаme

/用品/ 1/1 /(articlesOutlet1:文章// articlesOutlet2:新闻)

后点击此链接,其href变成

/articles/1/1/(1/1/(articlesOutlet1:article//articlesOutlet2:news)//articlesOutlet1:article//articlesOutlet2:news) 

这是一个不好的环节。我不想要改变一个href。如何实现?

Full example here http://plnkr.co/edit/EJOANe?p=preview

+0

指定组件外的路由器链接 – Akanksha

回答

0

如果指定routerLink像:

[routerLink]="['/articles/1/1', {outlets: {'articlesOutlet1': ['article'],'articlesOutlet2': ['news'] }}] 

一切工作正常。

相关问题