Как импортировать модуль (loadChildren) с условием в RouterModule?

#angular #routes

#angular #маршруты

Вопрос:

Я хочу динамически импортировать модуль (отложенная загрузка) в RouterModule.forRoot(routes) зависимости от условия, которое я получаю в Http-ответе. Что-то вроде:

 const routes: Routes = [
  ...
    {
    path: 'user-page',
    loadChildren: () => {
      if (SomeHttpRespCondition) {
        return import('./coach-page/coach-page.module')
          .then(m => m.CoachPageModule);
      } else {
        return import('./user-page/user-page.module')
          .then(m => m.UserPageModule);
      }
    }
  },
  ...
];

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

У кого-нибудь есть идея о том, как это правильно реализовать?

Заранее спасибо!

Комментарии:

1. Я бы переместил его в route guard с canLoad помощью .

2. @Chrillewoodz, насколько я понимаю, правильно canLoad решает, можно ли загружать модуль лениво. Но как вместо этого импортировать другой модуль? Не могли бы вы мне помочь, пожалуйста?

Ответ №1:

Вам не нужно иметь никакой логики в конфигурации маршрутов, в конфигурации маршрутов вы просто привязываетесь /user-page к UserPageModule и /coach-page к CoachPageModule .

Затем вам нужно реализовать защитные устройства для обоих маршрутов ( CanLoad или CanActivate в данном случае это не имеет большого значения), которые будут (вероятно, запрашивать и) проверять, действительно ли у пользователя есть доступ к целевой странице, и если он этого не делает, вы можете перенаправить его на нужную страницу.

Защита должна быть на обоих маршрутах, чтобы предотвратить доступ пользователя к недоступной для него странице. Для перенаправления вы можете использовать Router service или вернуть UrlTree объект (который указывает на перенаправленную страницу) из guard, и angular обработает его и перенаправит пользователя.