等待 RxJS 操作 - 阻塞？答案

【问题标题】：Wait for RxJS operation - to blocking?等待 RxJS 操作 - 阻塞？
【发布时间】：2017-08-26 01:13:08
【问题描述】：

我正在使用 Angular 4.3.5。我们的应用程序具有用户可以“订阅”的“程序”。我有一个看起来像这样的路由器保护功能：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    const programName = route.params['program_name'];
    const programId = this.programService.getIdForName(programName);
    if (this.userService.isLoggedIn()  &&  this.subscriptionService.isSubscribed(programId)) {
      return true;
    } else {
      this.router.navigate(['']);
      return false;
    }
}

要获取程序 ID，我需要调用服务器。要获取用户的订阅列表并确定他们是否订阅了此特定程序，我需要调用服务器。

服务器调用使用 RxJS 是异步的。但是，我的 canActivate 函数被限制为返回布尔值。我不确定如何弥合这种异步/同步编程差距。

例如，在 RxJava 中，我可以调用 toBlocking() 来等待 HTTP 调用解决。但是 RxJS 中没有这样的操作符。我试过toArray() 和take(1).toArray()[0]，但似乎没有任何效果。

事实上，我想把这个异步/同步桥往下推；即我希望subscriptionService.isSubscribed(programId)返回boolean而不是Observable<boolean>，因为我可以在SubscriptionService中缓存订阅列表，这样我就不需要每次都调用服务器；但我认为这不会改变编程挑战。

【问题讨论】：

标签： angular rxjs

【解决方案1】：

canActivate 函数可以返回 Observable<boolean>。

【讨论】：

哈，所以 Observables 一直向上？就这样吧。

【解决方案2】：

JS 中没有阻塞这么细。

Angular 可以处理返回的 observable

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    const programName = route.params['program_name'];
    return this.programService.getIdForName(programName).map(pn => {
      if (this.userService.isLoggedIn()  &&  this.subscriptionService.isSubscribed(programId)) {
        return true;
      } else {
        this.router.navigate(['']);
        return false;
      }
   });
}

【讨论】：