Неожиданное поведение при маршрутизации к детям с безкомпонентным маршрутом в Angular 5 - PullRequest
0 голосов
/ 16 мая 2018

У меня вопрос по маршрутизации Angular 5.

Если я объявлю маршруты, подобные приведенным ниже, route guard вызывается каждый раз, когда я направляю к одному из компонентов через routerLink в html.

const routes: Route[] = [ 
  { path: 'comp1', component: Comp1Component, canActivate: [AuthGuard]},
  { path: 'comp2', component: Comp2Component, canActivate: [AuthGuard]},
  { path: '', component: HomeComponent, canActivate: [AuthGuard]},
]

Но если я объявлю это с маршрутом componentless, охранник вызывается только при запуске приложения. И когда я переключаю маршруты в html, гвардия больше не вызывается.

const routes: Route[] = [
  { path: '', canActivate: [AuthGuard], children: [
  { path: 'comp1', component: Comp1Component},
  { path: 'comp2', component: Comp2Component}
]}

Почему защита маршрута в моем сценарии с родительским маршрутом без компонентов не вызывается каждый раз, когда выполняется маршрут к компоненту?

Ответы [ 2 ]

0 голосов
/ 16 мая 2018

Вот как это должно работать.

Допустим, у вас есть раздел администратора, который вы хотите охранять:

{
    path: 'admin',
    component: AdminComponent,
    canActivate: [AuthGuard],
    children: [..]
}

Как только вы попытаетесь перейти на /admin, будет вызван ваш охранник. Когда вы окажетесь в разделе администратора, дети не будут вызывать этого охранника.

Если вы хотите защитить дочерние маршруты, тогда вам нужно использовать CanActivateChild

const adminRoutes: Routes = [
  {
    path: 'admin',
    component: AdminComponent,
    canActivate: [AuthGuard],
    children: [
      {
        path: '',
        canActivateChild: [AuthGuard],
        children: [
            { path: 'comp1', component: Comp1Component},
            { path: 'comp2', component: Comp2Component}
        ]
      }
    ]
  }
];

AuthGuard должен реализовывать CanActivate и CanActivateChild

Вы можете найти больше информации в документации: Охрана маршрута

0 голосов
/ 16 мая 2018

Думаю, ваша охрана должна реализовать интерфейс CanActivateChild.

https://angular.io/api/router/CanActivateChild

const routes: Route[] = [
    { path: '', canActivate: [AuthGuard], canActivateChild: [AuthGuard], children: [
        { path: 'comp1', component: Comp1Component},
        { path: 'comp2', component: Comp2Component}
    ]}
]
...