return 布尔值而不是订阅 canActivate

Question

我有一个受 canActivate 守卫保护的组件。 checkLogin 函数中的 Authguard 从 observable 订阅，但我不知道如何 return 从它到 canActivate 的布尔值。

guard.service.ts

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    let url: string = state.url;

    return this.checkLogin(url);
  }

    public checkService:boolean;
  checkLogin(url: string):boolean {

         return this.loadAppSettings().subscribe(res=>{
              console.log(this.checkservice);
              if (this.checkservice == true) 
              {
                   return true; 
            }
            else{
                this.router.navigate(['/error-user']);
                return false;
            }
            });
      }//checkLogin throws error as type subscription is not assignable to type boolean

所以我想要的是，如果 this.checkService 为真，它应该只是 return 真，用户应该能够降落在受保护的路线上，但如果为假，他应该被导航到error-user。

这个问题和我的很相似，但无法解决我的问题。

有人可以帮忙吗。

Answer 1

canActivate 也可以 return 一个 observable，参见定义 CanActivate-interface。只需相应地更改 return 类型即可。

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
    let url: string = state.url;

    return this.checkLogin(url);
}

public checkService:boolean;
checkLogin(url: string):Observable<boolean> {
     return this.loadAppSettings().map(res=>{
          console.log(this.checkservice);
          if (this.checkservice == true) 
          {
               return true; 
        }
        else{
            this.router.navigate(['/error-user']);
            return false;
        }
    });
  }

Answer 2

我们可以return答应太喜欢...

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Promise<boolean> {
    return new Promise<boolean>(resolve => {
       this.service
       .function()
       .toPromise()
       .then((res) => {
         if(condition) {
            resolve(true);
         } else {
            this.router.navigate(["login"]);
            resolve(false); 
         } 
      })
      .catch(() => {
        this.router.navigate(["login"]);
        resolve(false);
       });
    });
  }

return 布尔值而不是订阅 canActivate

return boolean instead of subscribe to canActivate

rxjs

angular2-routing

angular