等待可观察订阅Angelar2

Question

在我的Angular2应用程序中，我使用canActivate来允许访问页面。 其中一部分是与服务器检查令牌没有被篡改，所以在我可以决定天气用户可以被授予访问权限之前，我需要调用我的API。 这意味着订阅Observable并等待答案。

我需要返回真或假，但由于我做了一个asyns调用，我不能根据我的回应返回。 我意识到我不能等待，因为它是单线程，但我需要以某种方式阻止，直到我有一个答案从API。 我canActivate如下所示：

canActivate() { 
    this.guardClient.checkToken("token") 
    .subscribe(response => { 
    let responseText = response.text().replace(/"/g, ''); 
    if (responseText === 'Ok') 
    { 
     return true; 
    } 
    if(responseText === 'denied') { 

     this.router.navigate(['login']); // redirecting to login 
     return false; 
    } 
    }); 
} 

有人能告诉我如何解决这个问题？

Answer 1

当在角2 CanActivate接口的样子，我看到以下内容：

export interface CanActivate { 
    canActivate(route: ActivatedRouteSnapshot, state:  RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean; 
} 

正如你所看到的，你可以只返回一个可观察为好，而不仅仅是一个布尔值。 这意味着你的代码可以被重写成这样。

canActivate() { 
return this.guardClient.checkToken("token") 
    .map(response => { 
    let responseText = response.text().replace(/"/g, ''); 
    if (responseText === ' Ok') 
     { 
     return true; 
     } 
    if(responseText === 'denied') { 
     this.router.navigate(['login']); // redirecting to login 
     return false; 
    } 
}); 
} 

这将使Angular等待observable解析，然后再决定是否可以显示路由。 请注意，此方法应该非常快以避免缓慢加载。