Angular AUTH保护在等待API响应时不起作用

Question

我在我的angular应用程序中使用AUTH Guard。它工作正常。但是当我等待API响应时，引用的页面没有加载。我的API工作正常。在AUTH保护中是否存在超时问题或其他问题?请帮助。

in my memberDetails-routing.module:

const routes: Routes = [
{
path: '', component: MemberLayoutComponent,
children: [
{ path: 'members', component: MemberListComponent , data: { roles: ["SuperAdmin"] }, canActivate:UserAuthGuard] }]
}];

in my member-auth.guard.ts:

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

return true; // Here it is working properly and members page is loaded

this.apiService.getMemberSettings().subscribe((response: any) => {
return true; // Here API is returning response but members page is not loaded
}
}

Answer 1

canActivate将不等待订阅响应。只返回

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

在canActivate中你应该返回Observable/Boolean/Promise

文档:https://angular.io/api/router/CanActivate