入れ子状態の角2のルーティング

Question

私はこのAppRoutingModuleとHomeRoutingModuleを以下に持っています。最初のパスにはいくつかのパスが含まれ、残りのパスはHomeRoutingModuleからインポートされます。 私の問題は、どのように私はHomeComponentの中にdepartmentIdを取得できますか？ 実は私の完全なパスは次のようになります。

• 'ドメイン：部門/：DepartmentIdの/収益'
• 'ドメイン：部門/：DepartmentIdの/ loadFactor' は、
• ...

それぞれの場合私は自分のURLのdepartmentIdだけを更新する必要があります。

AppRoutingModule

const routes: Routes = [ 
{ 
    path: 'home', 
    loadChildren: 'app/components/home/home.module#HomeModule', 
    data: { preload: true } 
}, 
{ path: '', redirectTo: 'home/departments/group/profitability', pathMatch: 'full' }, 
{ path: '**', component: PageNotFoundComponent } 
]; 

HomeRoutingModule

const homeRoutes: Routes = [ 
{ 
    path: 'departments', 
    component: HomeComponent, 
    children: [ 
     { path: ':departmentId/fabi', component: FabiComponent }, 
     { path: ':departmentId/loadFactor', component: LoadFactorComponent }, 
     { path: ':departmentId/otp', component: OtpComponent }, 
     { path: ':departmentId/profitability', component: ProfitabilityComponent }, 
     { path: ':departmentId/revenue', component: RevenueComponent }, 
     { path: ':departmentId/yield', component: YieldComponent } 
    ] 
}, 
{ path: '', redirectTo: 'home/departments/group/profitability', pathMatch: 'full' } 
]; 

Answer 1

あなたは、両方のルーティングのファイルが好きで、このように記述する必要があります。 AppRoutingModuleで、家の代わりに "departments"を書き留めます。

const routes: Routes = [ 
{ 
    path: 'departments', 
    loadChildren: 'app/components/home/home.module#HomeModule', 
    data: { preload: true } 
}, 
{ path: '', redirectTo: 'home/departments/group/profitability', pathMatch: 'full' }, 
{ path: '**', component: PageNotFoundComponent } 
]; 

そしてHomeRoutingModuleで、 "部署" を削除パスの後の言葉：...

const homeRoutes: Routes = [ 
{ 
    path: '', 
    component: HomeComponent, 
    children: [ 
     { path: ':departmentId/fabi', component: FabiComponent }, 
     { path: ':departmentId/loadFactor', component: LoadFactorComponent }, 
     { path: ':departmentId/otp', component: OtpComponent }, 
     { path: ':departmentId/profitability', component: ProfitabilityComponent }, 
     { path: ':departmentId/revenue', component: RevenueComponent }, 
     { path: ':departmentId/yield', component: YieldComponent } 
    ] 
}, 
{ path: '', redirectTo: 'home/departments/group/profitability', pathMatch: 'full' } 
]; 

私はそれがあなたのために働くことを願っています。

ありがとうございました