强制 RouterLink 在 Angular 2 中不更改 href

Question

我有多个命名的出口和 routerLinks 来为 Angular2 组件中的其他组件提供出口。

<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>

当应用程序启动时，第一个 link 的 href 变为

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

点击这个link后，它的href变成了

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

这很糟糕 link。我不想更改 href。如何实现？

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

Answer 1

如果像这样指定 routerLink：

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

一切正常。

强制 RouterLink 在 Angular 2 中不更改 href

Force RouterLink not to change href in Angular 2

routerlink

angular