angular - 来自 Angular Route Guard 的 Web Api 调用

Question

任何人都可以帮我解决为什么在从调用返回结果后，Angular 防护内部的异步调用不会激活路由吗？我尝试了几种利用 promise 和 observables 的方法，但运气有限。我还发现了这个 github issue特别是 albakov 的建议。对我来说重要的是要注意下面的代码片段执行。我在控制台中看到控制台消息，其中包含我也能够在服务器端 api 调用中中断的所有正确值。结果被传递到 canActivate 保护返回的 observable 中，但路由没有像预期的那样被激活。

具有调用 api 并将 _isAuthorized 主题与结果绑定(bind)的属性的服务方法:

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

在可观察的 bool 值解析为 true 之后，页面不会发生任何类型的控制台错误。

更新
如果我将重定向到 protected ( protected )路由从登录组件更改为硬重定向(即:window.location.href)而不是 router.navigate，则上述代码有效称呼。如果没有来自登录组件的硬重定向，如果我启用跟踪，路由器将取消导航，在解析 api 调用后到 protected 路由。

Answer 1

Angular 2 - Routing - CanActivate work with Observable

只需在 guard 中返回可观察的(Observable<boolean>)，它就会起作用!