2017-02-21 170 views
2

我有这AppRoutingModule和HomeRoutingModule下面。第一个包含一些路径并从HomeRoutingModule中导入其余路径。 我的问题是如何获得HomeComponent中的departmentId? 其实我的完整路径应该是:角2与嵌套状态路由

  • '域:部门/: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' } 
]; 

回答

0

你必须写这样的两个路由文件喜欢。 在AppRoutingModule中,写下“部门”而不是回家。

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' } 
]; 

我希望它会为你工作。

谢谢