使用辅助插座时出现“无法匹配任何路线”错误

【问题标题】："Cannot match any routes" error when using auxiliary outlet使用辅助插座时出现“无法匹配任何路线”错误
【发布时间】：2017-09-27 13:52:13
【问题描述】：

我正在尝试使用http://127.0.0.1:8080/#/reset/finish?key=26983684729750581998 url 访问组件。

路由配置给Error: Cannot match any routes. URL Segment: 'reset/finish'：

export const passwordResetFinishRoute: Route = {
    path: 'reset/finish',
    component: PasswordResetFinishComponent,
    outlet: 'loginOutlet'
};

以下是我的路由器插座配置：

<router-outlet></router-outlet>
<router-outlet name="loginOutlet></router-outlet>

我确定我正在导入路由配置。因为当我删除outlet: 'loginOutlet' 部分时，组件会显示在主路由器中。

提供outlet时Angular找不到路由配置的原因是什么？

【问题讨论】：

标签： angular

【解决方案1】：

这些路线有很大的不同。第一个是带有子路由的路由，第二个是基于命名组件的路由，没有子路由。

对于第一个，您告诉将路由加载为插座的子级。所以一旦路由完成，它会在路由内部搜索<router-outlet></router-outlet>并在那里加载PasswordResetFinishComponent。

由于没有提到名称并且路由是''，它将作为子路由加载到内部。所以会直接加载

<router-outlet> <router-outlet></router-outlet> </router-outlet>.

但是对于第二个，因为它是一个命名路由器插座loginOutlet。所以它会找到<router-outlet name='loginOutlet'></router-outlet> 并将组件加载到其中。

【讨论】：