Angular 角度10-手动输入时，canActivate Guard可防止导航到正确的URL

在我的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 }
    ]
  }

我试图让CanActivate guard阻止用户输入一个Id在：Id和：Id/编辑路由中不存在的URL。 canActivate在防止用户在URL中输入不存在的id方面似乎做得很好，但问题是，当用户手动输入正确的id时，它的行为与不正确的行为相同，但当单击具有相同正确id的routerLink时，它会起作用

我试着调试它，并得出结论，在下面的代码中，

this.indexTypeService

应该有我的索引类型列表，但实际上该列表中没有任何内容，只有在用户手动在地址栏中输入任何内容的情况下：

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);
  }
}

导出类ErrorPageGuard实现CanActivate、CanActivateChild{
构造函数（私有indexTypeService:indexTypeService，私有路由器：路由器）{}
canActivate（路由：ActivatedRouteSnapshot，状态：RouterStateSnashot）：可观察的|承诺|布尔值{
//TODO:以编程方式导航时有效，但手动导航时无效
让state_id=state.url.split（'/'）[state.url.split（'/'）.length-1]；
让route_id=+route.params.id；
让id=Object.keys（route.params）。长度>0？路由id:（！isNaN（+state\u id）？+state\u id:-1）；
if（（Object.keys（route.params）.length==0）
||（this.indexTypeService.getIndexType（id）！==未定义））{
返回true；
}
否则{
this.router.navigate（['/']）；
返回false；
}
}
canActivateChild（路由：ActivatedRouteSnapshot，状态：RouterStateSnashot）：可观察的|承诺|布尔值{
返回此.canActivate（路由、状态）；
}
}

---

我做错了什么？

那

索引类型

列表是如何填充的？@AndreiGătej，它发生在组件的onNgInit（）上，它们使用一个服务，在这个服务中，我对一些外部API有一个http.get（）请求。你可以让你的保护返回一个可观察的，这样当列表为空（或未初始化）时，你可以先做request@AndreiGătej，你能告诉我怎么做吗？

indexTypes

list是如何填充的？@anderigătej，它发生在组件的onNgInit（）上，它们使用一个我有http.get（）的服务请求一些外部API。你可以让你的守卫返回一个可观察的，这样当列表为空（或未初始化）时，你可以首先request@AndreiGătej，你能告诉我怎么做吗？