Angular2：子组件中的多个路由器出口

Question

我正在创建 scotch.io 的angular-ui-router 教程的 ng2 版本。我能够实现页面的基本home导航about。home我能够为儿童创建导航，即list和paragraph。我被about页面困住了。我能够导航到“关于”页面，但无法在相应的商店中呈现component的子项。about这就是我正在做的：

about.component.html

<div class="jumbotron text-center">
    <h1>The About Page</h1>
    <p>This page demonstrates <span class="text-danger">multiple</span> and <span class="text-danger">named</span> views.</p>
</div>
<div class="row">
    <div class="col-sm-6">
        <router-outlet name="aboutOne"></router-outlet>
        <router-outlet name="aboutTwo"></router-outlet>
    </div>
</div>

关于.routes.ts

export const aboutRoutes: Routes = [
    {
        path: 'about',
        component: AboutComponent,
        children: [
            {
                path: 'about',
                outlet: 'aboutOne',
                component: AboutOneComponent
            },
            {
                path: 'about',
                outlet: 'aboutTwo',
                component: AboutTwoComponent
            }
        ]
    }
];

关于路由.module.ts

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

import { aboutRoutes } from './about.routes';
@NgModule({
    imports: [RouterModule.forChild(aboutRoutes)],
    exports: [RouterModule]
})
export class AboutRoutingModule {

}

我不知道我错过了什么。关于页面正在渲染，但它没有渲染它的子组件，控制台中也没有错误。这是完整的github 存储库。

Answer 1

在玩过named后<router-outlet>，我发现了这一点。我没有给出正确的路径。由于当用户登陆页面时，我的两个组件都应该在相应的出口中呈现about。两者都没有相对网址/路径。他们是 的默认子代about。所以我将我的更新path:'about'为path:''. 它开始起作用了。希望这对某人有帮助。

关于.routes.ts

export const aboutRoutes: Routes = [
    {
        path: 'about',
        component: AboutComponent,
        children: [
            {
                path: '',
                outlet: 'aboutOne',
                component: AboutOneComponent,
                pathMatch: 'full'
            },
            {
                path: '',
                outlet: 'aboutTwo',
                component: AboutTwoComponent,
                pathMatch: 'full'
            }
        ]
    }
];

@Pradeep 感谢您强调这个path问题。