Отложенная загрузка вложенного модуля и маршрутизация

Question

У меня проблема с маршрутизацией внутри лениво загруженных модулей.

Вот мои "корневые" маршруты:

const routes: Routes = [
  {path: '', redirectTo: 'admin', pathMatch: 'full' },
    {path: 'admin', loadChildren: 'app/admin.module#AdminModule'}
];

@NgModule({
  imports: [
      RouterModule.forRoot(routes)
  ],
  exports: [
      RouterModule
  ]
})
export class MainRoutingModule {}

Так что я ожидаю от моего приложения, это перенаправить пустой путь к /admin - это работает нормально, модуль загружен.

в AdminModule я получил еще одно перенаправление:

const routes: Routes = [
    {path: '', component: AdminComponent, children: [
        {path: '', redirectTo: 'app', pathMatch: 'full' },
        {path: 'app', loadChildren: './app/app.module#AppModule', canActivate: [ AuthGuard ] },
        {path: 'login', component: LoginComponent}
    ]},
];

@NgModule({
    imports: [
        RouterModule.forChild(routes),
        AppModule
    ],
    exports: [
        RouterModule
    ]
})
export class AdminRoutingModule {}

Здесь я получил два сценария:

• если пользователь аутентифицирован перенаправить на app - так что весь путь будет /admin/app
• иначе перенаправить на login - так весь путь должен быть /admin/login

и, наконец, маршрутизация в приложении администратора:

const routes: Routes = [
  { path: '', component: AppComponent, children: [
    { path: '',  redirectTo: 'home', pathMatch: 'full' },
    { path: 'home', component: HomeComponent},
  ]}
];

И теперь проблемы начинаются. Если я войду в мою сторону с URL localhost:3000/admin/app/(*) все работает, как и ожидалось, AuthGuard вызывается, URL-адрес в порядке, в случае, если пользователь не прошел проверку подлинности, он перенаправляется на страницу входа.

Но! Если я войду localhost:3000 приложение перенаправляет меня на localhost:3000/admin/home (app отсутствует) и AuthGuard не вызывается. Похоже, что Angular пропускает admin-routing.module и идет прямо к последнему.

Какова причина? Как я могу это исправить?

Answer 1

В AdminModule Вы можете добавить canActivate в маршрут по умолчанию.

const routes: Routes = [
    {path: '', component: AdminComponent, children: [
        {path: '', redirectTo: 'app', pathMatch: 'full'  canActivate: [ AuthGuard ]},
        {path: 'app', loadChildren: './app/app.module#AppModule', canActivate: [ AuthGuard ] },
        {path: 'login', component: LoginComponent}
    ]},
];