Angular 10 - canActivate Guard предотвращает переход к правильному URL-адресу при вводе вручную - PullRequest
Новая
       21

Angular 10 - canActivate Guard предотвращает переход к правильному URL-адресу при вводе вручную

1 голос
/ 04 августа 2020

В моем приложении Angular 10 у меня есть маршрут с несколькими дочерними маршрутами, на котором есть защита canActivate. 

{
    path: 'settings', component: SettingsComponent,
    children: [
      { path: '', redirectTo: 'index-types', pathMatch: 'full' },
      {
        path: 'index-types', component: IndexTypesComponent,
        resolve: [IndexTypeResolverService],
        canActivateChild: [ErrorPageGuard],
        children: [
          { path: '', component: IndexTypeStartComponent },
          { path: 'new', component: IndexTypeEditComponent },
          {
            path: ':id',
            component: IndexTypeDetailComponent,
            resolve: [IndexTypeResolverService]
          },
          {
            path: ':id/edit',
            component: IndexTypeEditComponent,
            resolve: [IndexTypeResolverService]
          }
        ]
      },
      { path: 'users', component: UsersComponent }
    ]
  }

Я пытаюсь получить защиту canActivtate, чтобы предотвратить пользователя от ввода URL-адреса с идентификатором, которого нет в маршрутах: id и: id / edit. CanActivate, похоже, хорошо справляется с задачей предотвращения ввода пользователем несуществующего идентификатора в URL-адрес, но проблема в том, что когда пользователь вводит URL-адрес вручную с правильным идентификатором, он ведет себя так же, как если бы он был неправильным, но когда щелкнув routerLink с тем же правильным идентификатором, он работает.

Я попытался отладить его и пришел к выводу, что в следующем коде this.indexTypeService, который должен иметь список моих indexTypes, не На самом деле есть что-нибудь в этом списке, только в том случае, если пользователь вводит что-либо вручную в адресную строку: 

export class ErrorPageGuard implements CanActivate, CanActivateChild {

  constructor(private indexTypeService: IndexTypeService, private router: Router) { }

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    //TODO: works when navigating programmatically, but not when navigating manually

    let state_id = state.url.split('/')[state.url.split('/').length - 1];
    let route_id = +route.params.id;
    let id = Object.keys(route.params).length > 0 ? route_id : (!isNaN(+state_id) ? +state_id : -1);


    if ((Object.keys(route.params).length === 0)
      || (this.indexTypeService.getIndexType(id) !== undefined)) {
      return true;
    }
    else {
      this.router.navigate(['/']);
      return false;
    }
  }

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

Что я делаю не так?

...