Angular2嵌套路由器出口

Question

我正在使用 Angular 2，但路由器遇到了一些问题。 我想在主路由器插座内有第二个路由器插座。

在第一个路由器插座中，我重定向到主页，在那里我有第二个路由器插座：

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

这是我的 app.routing 没有导入。

const appRoutes: Routes = [
    { path: '', component: HomeComponent },
    { path: 'login', component: LoginComponent},
    { path: 'days', component: DaysComponent, outlet: 'main'}
];

export const appRoutingProviders: any[] = [

];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

在 HomeComponent ngOnInit 我有这个

this.router.navigateByUrl('/(main:days)');

但这会使网络崩溃并出现以下错误：

未捕获（承诺）：错误：找不到要加载“DaysComponent”的主要出口

第二个路由器插座怎么可能在主插座里面？

谢谢。

Answer 1

试试这个路由配置：

const appRoutes: Routes = [
    { path: '', component: HomeComponent },
    { path: 'login', component: LoginComponent},

    {
        path: 'wrap',
        component: HomeComponent,
        children: [
          {
            path: 'days',
            component: DaysComponent,
            outlet: 'main'
          }
        ]
    }
];

还有这个网址：

this.router.navigate(['/wrap', { outlets: { main: 'days' } }]);

或（等效）

this.router.navigateByUrl('/wrap/(aux:aux)');