私は私のアプリでは、以下のルーティングの設定があります。ルーティング&モジュール
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をレンダリングしますが、私が望む動作ではありません。
私はUserComponentに/ admin/usersからのみアクセスしたいと思います。
誰も私の理由を説明できますか?
あなたが管理者にすべてリダイレクトしているので: '{パス: ''、redirectTo: '管理者'、pathMatch: 'フル'}' – jonrsharpe
問題ではありません。このパスを削除しても、アプリケーションは期待どおりに動作しません。 /ユーザーは使用できないはずですが、/ admin/usersは使用できません。 –
[style guide](https://angular.io/guide/styleguide#style-02-12)からのボーナス:* RoutingModuleのファイル名を '-routing.module.ts' *で終了します(CLIはあなたのためにこれを行う) – Leo