2017-06-01 164 views
0

我有一個SecuredModule,當用戶訪問/secured路徑時動態加載(在我的app.routing.ts中)。Angular2路由器 - 帶重定向到默認子組件的父路由

在這個模塊我有以下路線定義:

const APP_ROUTES: Routes = [ 
    { path: '', component: SecuredComponent, , children: [ 
     { path: 'application', loadChildren: 'app/application/application.module#ApplicationModule'} 
    ]}, 
    { path: '**', pathMatch: 'full', redirectTo: 'application' } 

]; 

作爲該模塊裝有loadChildren,然後在該實例中''(缺省)路由實際上是指'/secured'。在''路徑我需要加載SecuredComponent,因爲我有自定義佈局和<router-outlet>標記,它將顯示此路由的子項。

'/secured'不爲用戶登陸一個有效的途徑,因爲SecuredComponent只是一個佔位符,所以我需要把它們自動重定向到'application'兒路線。

的問題是定義重定向功能得到只有當我進入到一個不存在的路徑調用,例如像'secured/any-fake-route'

回答

0

的問題是,{ path: '**', pathMatch: 'full', redirectTo: 'application' }定義是在最底層,所以它訥韋爾得到當用戶訪問'/secured'時調用,因爲''是有效的路由並且首先匹配。

我解決了這個問題如下:

const APP_ROUTES: Routes = [ 
    { path: '', pathMatch: 'full', redirectTo: 'application' }, 
    { path: '', component: SecuredComponent, canActivate: [SecuredMiddlewareService], children: [ 
     { path: 'application', loadChildren: 'app/application/application.module#ApplicationModule'} 
    ]}, 
    { path: '**', pathMatch: 'full', redirectTo: 'application' }, 
]; 

注重第一線。當用戶訪問'/secured'時,他們會自動重定向到'/secured/application'。由於'application'''的子路由,那麼它們都被調用。

所以,用這樣的結構,所有的下列實施例成功地重定向到'/secured/application'如期望:

  • '/secured'
  • '/secured/application'
  • '/secured/any-fake-route'