Angular 路由器 v3：以命名出口为目标答案

【问题标题】：Angular router v3: targeting named outletAngular 路由器 v3：以命名出口为目标
【发布时间】：2016-10-27 00:00:34
【问题描述】：

我正在尝试路由到指定的插座，但我无法这样做。我已经修改了官方 angular plunk（演示的危机示例）。我在crisis-center.component 中创建了一个名为 outlet 的“详细信息”，并修改了 Admin 链接以路由到这个新的 outlet <a [routerLink]="['/crisis-center/detail:admin']">Crisis Admin</a>

这不起作用。它导航到组件管理员，但在默认插座中，我也尝试过使用导航方法，但这也有类似的问题。

http://plnkr.co/edit/KXOGwX8bW0AYc86OgVdQ?p=preview

我也尝试在管理路由定义中添加插座，但仍然是同样的问题

 `{
        path: 'admin',
        component: CrisisAdminComponent,
        outlet: 'detail',
        canActivate: [AuthGuard]
      }`,

@angular/路由器：3.0.0-alpha.7

=======编辑：======

@angular/路由器：3.0.0-alpha.8

我已经更新了 plunker https://plnkr.co/edit/Kn4yBi5oytNVcFvUvGLR?p=preview 。现在我正在指定的管理出口中加载管理组件

使用 navigateByUrl 时，我在控制台中遇到以下错误。

`platform-browser.umd.js:2311 EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: 'crisis-center/admin:admin'`

【问题讨论】：

标签： angular angular2-routing

【解决方案1】：

更新

RC.5中有fix on it's way登陆

原创

routerLink 还不支持命名<router-outlet>。使用router.navigateByUrl() 已经可以实现这一点，但辅助路由并未得到完全支持，并且存在一些已知问题。

例子：

this._router.navigateByUrl("/crisis-center(aux:chat;open=true)");

另见Angular2 router in one component

Plunker example

【讨论】：

我更新了一个 plunkr。 navigateByUrl 没有帮助。我已尝试根据当前项目的要求创建级联插座。
Plunker 包含约 20 个文件。我不知道该寻找什么。
对不起，我在编辑中引用了错误的 plunker。我将 plunkr 缩减为 5-6 个有用的文件。演示问题的文件是crisis-center.componenet（有多个出口）和crisis-detail.component plunk plnkr.co/edit/Kn4yBi5oytNVcFvUvGLR?p=preview
我在crisis-detail.component.ts 中添加了()，它似乎工作正常。 plnkr.co/edit/L02zD2BviQ4X6RirivY7?p=preview
感谢这工作。当我们单击显示管理员时，我已更新 plunk 以并排显示（主要和管理出口）。我会在我的项目中尝试这个，希望这会奏效