Angular 功能模块中的 2 条路由

Question

我必须在主模块和功能模块中使用路由。当我将路由器导入功能模块时，应用程序无法运行，浏览器处于 "thinking" 并保持加载状态，直到 chrome 显示 "the page doesnt't respond".

我跟了没成功

应用路由：

const appRoutes: Routes = [
        { path: 'login', component: AuthComponent },
        { path: 'register', component: RegisterComponent },
        { path: 'resetpassword', component: ResetPassword },
        { path: 'resetpassword/choose', component: ChoosePassword },
        { path: 'tournament', component: Tournament },
        { path: '', component: HomeComponent, pathMatch: 'full', canActivate: [AuthGuard] },

        { path: '**', redirectTo: '' }
    ];

    export const routing = RouterModule.forRoot(appRoutes);

以及功能模块中的路由：

const appRoutes: Routes = [
    {
        path: 'tournament', component: Tournament, children:
        [
            { path: 'new', component: TournamentCreationMain },
        ]
    },
    { path: '', component: Tournament, pathMatch: 'full', canActivate: [AuthGuard] },

    { path: '**', redirectTo: '' }
];

export const routingTournament = RouterModule.forChild(appRoutes);

在 app.module 中，我导入了功能模块和 app.router:

imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    TournamentModule,
    routing
]

在功能模块中我导入了自己的路由器：

imports: [
    CommonModule,
    FormsModule,
    routingTournament,
    HttpModule
]

提前致谢最大值

Answer 1

据我所知，您不必在 appRoutes 中为锦标赛路径定义锦标赛组件。您还应该在 children 数组中定义锦标赛的所有子路线。请尝试更改为：

    const appRoutes: Routes = [
        {
            path: 'tournament', 
            children: [
                { path: 'new', component: TournamentCreationMain },
                { path: '', component: Tournament, pathMatch: 'full', canActivate: [AuthGuard] },
                { path: '**', redirectTo: '' }
            ]
        },

    ];

Angular 功能模块中的 2 条路由

Angular 2 route in feature module

angular2-routing

angular