Question

任何人都可以帮助我解决为什么Angular后卫内的异步调用在调用返回结果后不会激活路由的原因？我尝试了几种利用承诺和观察能力有限的方法。我还发现了这个github issue特别是albakov的建议。对我来说，重要的是要注意下面的片段执行。我在控制台中看到控制台消息，其中包含所有正确的值，我也可以在服务器端api调用中断。结果传递给canActivate后卫返回的observable，但路线未按预期激活。

具有调用api的属性的服务方法，并使用结果绑定_isAuthorized主题：

private _isAuthorized: ReplaySubject<boolean> = new ReplaySubject(1);
get isAuthorized() { return this._isAuthorized.asObservable(); }

checkAuthority(id: number) {
    return this._http.get(this._apiUrl).toPromise().then((response) => {
        console.log(response + ' I resolved!');
        if (response.status === 200)
            this._isAuthorized.next(true);
    });

消费守卫可以激活方法：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): any {
  let id: number = this.getId();

  if (!this._oauthService.hasValidIdToken()) {
    this._router.navigate([`/login/${id}`]);
    return Observable.of(false);
  }

  this._myService.checkAuthority(id);
  return this._myService.isAuthorized.first();
}

在可观察布尔值的解析为真后，页面永远不会发生任何类型的控制台错误。

更新如果我将重定向更改为从登录组件到硬重定向（即：window.location.href）而不是router.navigate调用的受保护（保护）路由，则上述代码可以正常工作。如果没有来自登录组件的硬重定向，路由器会在解析api呼叫后取消导航（如果我启用跟踪）到受保护路由。

Answer 1

Angular 2 - Routing - CanActivate work with Observable

只需在守卫中返回可观察的（Observable<boolean>），它就会起作用！

来自Angular Route Guard的Web Api电话

1 个答案: