我使用 angular 5.2.0 并导航到：
/page/28/1
对应于：
{path: 'page/:albumId/:pageNo', component: AlbumPageComponent}
AlbumPageComponent html 包含：
<a class="nav-link" [routerLink]="[{ outlets: { popup: ['login'] } }]">
对应于：
{path: 'login', component: LoginComponent, outlet: 'popup'}
并且应该与<router-outlet name="popup"></router-outlet>放入经典的app.component.html 一起使用（这是一个简单的 Angular cli 生成项目）。
这不起作用，因为我在控制台中注意到错误的形成路径：
NavigationStart(id: 3, url: '/page/28/1/(popup:login)')
但是以这种方式使用时确实有效：
<a class="nav-link" [routerLink]="" (click)="goToLogin()">
与 AlbumPageComponent 具有：
goToLogin() {
this.router.navigate([{outlets: {popup: ['login']}}]);
}
然后形成正确的路径：
NavigationStart {id: 3, url: "/page/28/1(popup:login)"}
请注意，两种情况的路由命令是相同的，这意味着：
[{outlets: {popup: ['login']}}]
问：这种routerLink方法有什么问题？怎么可能修好？
PS：我还在.angular-cli.json中使用： “baseHref”：“/albums/”，尽管我认为这没有理由成为问题
编辑
https://angular.io/guide/router#wrap-up-and-final-app中的示例也是如此。为了复制，您必须将<a/>for Contact复制到 CrisisCenterComponent html。这样，就像我一样，人们会[routerLink]在与 AppComponent 不同的组件中使用方法。直接在 AppComponent html 中使用该[routerLink]方法有效。