嵌套子路由是否与Angular 2中不支持的命名路由器出口相结合

Rol*_*ers 6 angular2-routing angular

研究员,编码器,

我有以下路由表:

const routes: Routes = [
    { path: '', redirectTo: 'main', pathMatch: 'full' },
    {
        path: 'main', component: MainComponent,
        children: [
            { path: 'spaceoverview', component: SpaceOverviewComponent, outlet: 'mainview' },
            { path: 'create-menu', component: CreateMenuComponent, outlet: 'sidebar' },
            { path: 'create-space', component: CreateSpaceComponent, outlet: 'mainview' },
            { path: 'update-menu/:id', component: UpdateMenuComponent, outlet: 'sidebar' },
            { path: 'update-space/:id', component: UpdateSpaceComponent, outlet: 'mainview' },
            { path: 'empty-menu', component: EmptyMenuComponent, outlet: 'sidebar' },
            { path: 'empty-main', component: EmptyMainComponent, outlet: 'mainview' },
            { path: 'update-categories', component: ChangeCategoriesComponent, outlet: 'mainview' },
            {
                path: 'permissions/:id', component: TestComponent, outlet: 'mainview',
                children: [
                    { path: 'create-reader/:id', component: CreateReaderComponent, outlet: 'top' },
                    { path: 'reader-overview/:id', component: ReaderOverviewComponent, outlet: 'bottom' },
                    { path: 'empty-top', component: EmptyTopComponent, outlet: 'top' },
                    { path: 'empty-bottom', component: EmptyBottomComponent, outlet: 'bottom' }
                ]
            }
        ]
    },
    { path: '**', component: PageNotFoundComponent }
];
Run Code Online (Sandbox Code Playgroud)

它们都是main的子路由,权限也是,除了它有自己的子路由.

不幸的是,我似乎无法让它工作.我已经尝试了很多东西......

使用以下命令加载非嵌套子项:

this.router.navigate(['/main', { outlets: { 'sidebar': ['update-menu', id], 'mainview': ['update-space', id] } }]);
Run Code Online (Sandbox Code Playgroud)

没问题,相应的网址变成:

http://localhost:4200/main/(sidebar:update-menu/123//mainview:update-space/123)
Run Code Online (Sandbox Code Playgroud)

但是当我尝试加载权限子路由时,使用命名的路由器出口,如:

this.router.navigate(['/main', { outlets: { 'mainview': ['/permissions', this.id, { outlets: { 'top': ['create-reader'], 'bottom': ['reader-overview'] } }], 'sidebar': ['update-menu', this.id] } }]);
Run Code Online (Sandbox Code Playgroud)

它只是不会加载......

Angular 2路由器是否支持使用命名路由器出口的嵌套路由,或者我是否碰到它的边界?

请帮助一个沮丧的Angular 2编码器......