Угловая 5 навигация отменена с охраны

Question

У меня настроена маршрутизация, как указано ниже.

const PUBLIC_ROUTES: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: 'login', component: LoginComponent },
{ path: 'session-transfer/:id', component: SessionTransferComponent }
];

const SECURE_ROUTES: Routes = [
{ path: 'clients', component: ClientSelectionComponent },
{ path: 'app/:application', component: SessionTransferComponent },
{ path: 'applications', component: AppSelectionComponent },
{ path: '', redirectTo: 'clients', pathMatch: 'full' }
];

const routes: Routes = [
{ path: 'st/:transferId',canActivate: [AuthGuard], canActivateChild: [AuthGuard], children: SECURE_ROUTES },
{ path: '', redirectTo: '/login', pathMatch: 'full', },
{ path: '', component: PublicComponent, children: PUBLIC_ROUTES },
{ path: '', component: SecureComponent, canActivate: [AuthGuard], canActivateChild: [AuthGuard], children: SECURE_ROUTES }
];

@NgModule({
imports: [RouterModule.forRoot(routes, { useHash: true })],
exports: [RouterModule]
})

Ниже приведен пример кода AuthGuard

_canActivate() {
  return true;
}

canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | 
boolean {

return this._canActivate();
}

canActivateChild(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | 
boolean {
     return this._canActivate();
}

При переходе к маршруту st/:transferId/app/:application навигация отменяется. В журнале трассировки GuardCheckEnd ShouldActivate возвращается значение true. Даже тогда nvigation отменяет и перенаправляет на /login маршрут.

Может кто-нибудь, пожалуйста, помогите. Спасибо

Answer 1

Я считаю, что причина вашей ошибки лежит здесь:

        const routes: Routes = [
    { path: 'st/:transferId',canActivate: [AuthGuard], canActivateChild: [AuthGuard],children: SECURE_ROUTES }, 
    { path: '', redirectTo: '/login', pathMatch: 'full', }, { path: '', component: PublicComponent, children: PUBLIC_ROUTES }, 
    { path: '', component: SecureComponent, canActivate: [AuthGuard], canActivateChild: [AuthGuard], children: SECURE_ROUTES } ]; 

Angular использует маршруты в зависимости от порядка их расположения. В вашем случае у вас есть три маршрута к одному пути. Таким образом, angular будет использовать первый маршрут в массиве Routes, который совпадает с путем, который является логином.

Мое предложение для этого

1. Позвольте охранникам управлять редиректом для входа. Например, в сервисе AuthGuard,

   if(!this._activate){
        this.router.navigate(['/login'])}
   else{
       return this._activate
    }
   

2. Дайте общедоступным маршрутам и защищенным маршрутам уникальные пути, а не пустую строку и, наконец, удалите имя входа redirectTo из маршрутов.