功能模块中的角度2路由
问题描述:
我必须使用到主模块和功能模块中的路由。 当我将路由器导入功能模块时,应用程序无法工作,浏览器正在“思考”并保持加载状态,直到Chrome显示“该页面无响应”。功能模块中的角度2路由
我跟着没有成功 this answer
的应用途径:
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
]
在此先感谢 最大
答
至于我看到你没有定义锦标赛组件在appRoutes比赛路径。您还应该在儿童阵列中定义比赛的所有儿童路线。请尝试更改为:
const appRoutes: Routes = [
{
path: 'tournament',
children: [
{ path: 'new', component: TournamentCreationMain },
{ path: '', component: Tournament, pathMatch: 'full', canActivate: [AuthGuard] },
{ path: '**', redirectTo: '' }
]
},
];
它的工作原理类似于魅力,谢谢。为什么更扁平的配置不起作用?例如:const appRoutes:Routes = {path:'tournament',component:Tournament}, {path:'tournament/new',component:TournamentCreationMain}, {path:'',component:Tournament,pathMatch: 'full',canActivate:[AuthGuard]}, {path:'**',redirectTo:'tournament'} ]; –