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)');