В Angular можно ли загружать разные модули в зависимости от того, аутентифицирован ли пользователь или нет? - PullRequest
Новая
       32

В Angular можно ли загружать разные модули в зависимости от того, аутентифицирован ли пользователь или нет?

0 голосов
/ 26 декабря 2018

Например, URL: www.example.com должен загружать один модуль, если пользователь аутентифицирован, иначе он должен загружать другой модуль.

Я пытался использовать охранники, но это нене работает, как я ожидаю.

Я довольно новичок в Angular.Было бы очень полезно, если бы кто-то мог написать примерный массив маршрутов для демонстрации.:)

Если пользователь не аутентифицирован, я хочу, чтобы мои маршруты работали примерно так: 

  {
    path: '',
    loadChildren: './home/home.module#HomeModule'
  },
  {
    path: 'login',
    loadChildren: './login/login.module#LoginModule'
  },
  {
    path: 'register',
    loadChildren: './register/register.module#RegisterModule'
  }

Иначе, если пользователь аутентифицирован, я хочу, чтобы мои маршрутыработать примерно так: 

  {
    path: '',
    pathMatch: 'full',
    redirectTo: '/dashboard'
  },
  {
    path: 'dashboard',
    loadChildren: './dashboard/dashboard.module#DashboardModule'
  },
  {
    path: 'profile',
    loadChildren: './user-profile/user-profile.module#UserProfileModule'
  }

1 Ответ

0 голосов
/ 26 декабря 2018

Да, вы можете добиться этого, используя CanActivate охранник (проверка доступа к маршруту).

CanActivate Проверяет, может ли пользователь посетить маршрут.

Сказав, чтоЯ ожидаю, что вы перенаправите на другой маршрут после guardCheck.

У вас не должно быть конфигурации маршрутизатора для размещения двух разных компонентов или модулей на одном маршруте.Вы можете добавить их как дочерний элемент для маршрута и решить, нужно ли вам использовать маршрут на том же маршруте.

Обновление :

Я столкнулся с понятием matcher, котороеможет использоваться для загрузки двух разных маршрутов по одному и тому же пути: 

const routes: Routes = [{
  path: 'list',
  matcher: matcherForAuthenticatedRoute,
  loadChildren: './user/register#RegisterModule'
},
{
  path: 'list',
  matcher: matcherForTheOtherRoute,
  loadChildren: './user/home#HomeModule'
}]

Теперь наша логика сопоставления зависит от двух функций, которые могут быть следующими: 

export function matcherForAuthenticatedRoute(
 segments: UrlSegment[],
 group: UrlSegmentGroup,
 route: Route) {
  const userService =  appInjector.get(MyService);
  const isPathMatch = segments[0].path === route.path;
  const isUserAuthenticated = userService.isUserAuthenticated('userId');      
  if(isPathMatch && isUserTypeMatch) { 
    return {consumed: [segments[0]]};
  } else {
    return null;
  }
}

Мы можем определить appInjector после загрузки приложения и экспорта его для использования: 

appInjector = componentRef.injector;
...