路由和模块
问题描述:
我在我的应用程序下面的路由配置:路由和模块
app.module.ts
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HttpModule,
AppRouting,
// Feature Modules
CoreModule,
AuthModule,
AdminModule,
SharedModule
],
bootstrap: [AppComponent]
})
app.routing.ts
const routes: Routes = [
{ path: '', redirectTo: 'admin', pathMatch: 'full' },
{ path: 'admin', loadChildren:() => AdminModule }
];
@NgModule({
imports: [
RouterModule.forRoot(routes, {preloadingStrategy: PreloadAllModules})
],
exports: [RouterModule]
})
admin.module.ts
@NgModule({
declarations: [
AdminComponent
],
imports: [
CommonModule,
FormsModule,
UserModule,
AdminRouting,
SharedModule
],
providers: [
UserService
]
})
admin.routing.ts
const routes: Routes = [
{ path: '', component: AdminComponent, canActivate: [AuthGuard], children: [
{ path: 'users', loadChildren:() => UserModule }
]}
];
@NgModule({
imports: [
RouterModule.forChild(routes)
],
exports: [RouterModule]
})
user.module.ts
@NgModule({
declarations: [
UserComponent,
UserManageComponent,
UserListComponent
],
imports: [
CommonModule,
FormsModule,
UserRouting,
SharedModule
]
})
user.routing.ts
const routes: Routes = [
{ path: '', component: UserComponent, children: [
{ path: '', component: UserListComponent },
{ path: 'new', component: UserManageComponent },
{ path: ':id/edit', component: UserManageComponent }
]},
];
@NgModule({
imports: [
RouterModule.forChild(routes)
],
exports: [RouterModule]
})
还有的问题:
我希望我的应用程序路由做:
/users => not a valid route
/users/new => not a valid route
/admin/users => valid route
/admin/users/new => valid route
/admin => valid route (should render AdminComponent)
我不知道为什么,但是如果我输入/ users,应用程序呈现UserComponent,那么我不想要的行为是什么。
我想只能从/ admin/users访问UserComponent。
有人可以解释我为什么吗?
答
您是否已经尝试将AppRouting导入移动到导入数组结尾?
答
试试这个看:
admin.routing.ts
const routes: Routes = [
{ path: 'admin', component: AdminComponent, canActivate: [AuthGuard],
children: [{ path: 'users', loadChildren:() => UserModule }]}
];
因为你要重定向一切管理:'{路径: '',redirectTo: '管理员',pathMatch: '全'}' – jonrsharpe
这不是问题。即使我删除了这条路径,该应用程序仍然无法按预期工作。 /用户不应该可用,但/ admin/users。 –
[样式指南](https://angular.io/guide/styleguide#style-02-12)的奖励:*使用'-routing.module.ts' *结束RoutingModule的文件名*(CLI将会为你做这个) – Leo