如何使用可观察到的在角2名警卫canActivate（）(How to use an observa

我已经创建了一个认证后卫我angular2 RC5的应用程序。

我也用终极版商店。在那家店我保持用户的认证状态。

我读的保护可以返回一个可观察或承诺（ https://angular.io/docs/ts/latest/guide/router.html#!#guards ）

我似乎无法找到保护等到店/观察到的被更新，并且只更新后返回不敢掉以轻心，因为商店的默认值将始终是假的方式。

第一次尝试：

@Injectable()
export class AuthGuard implements CanActivate {

  @select(['user', 'authenticated']) authenticated$: Observable<boolean>;

  constructor() {}

  canActivate(): Promise<boolean> {

    return new Promise((resolve, reject) => {

      // updated after a while ->
      this.authenticated$.subscribe((auth) => {

        // will only reach here after the first update of the store
        if (auth) { resolve(true); }

        // it will always reject because the default value
        // is always false and it takes time to update the store
        reject(false);

      });

    });

  }

}

第二次尝试：

@Injectable()
export class AuthGuard implements CanActivate {

  @select(['user', 'authenticated']) authenticated$: Observable<boolean>;

  constructor() {}

  canActivate(): Promise<boolean> {

    return new Promise((resolve, reject) => {

      // tried to convert it for single read since canActivate is called every time. So I actually don't want to subscribe here. 
      let auth = this.authenticated$.toPromise(); 

      auth.then((authenticated) => {

        if (authenticated) { resolve(true); }

        reject(false);

      });

      auth.catch((err) => {
        console.log(err);
      });

  }

}

Answer 1:

当您订阅可观察到的，你可以提供一个回调函数; 在下面的例子中，我把它叫做CompleteGet 。 CompleteGet()将仅在成功获取返回的数据，而不是一个错误调用。你把你的回调函数需要在逻辑上任何后续。

getCursenByDateTest(){
 this.cursenService
   .getCursenValueByDateTest("2016-7-30","2016-7-31")
   .subscribe(p => {
     this.cursens = p;
     console.log(p)
     console.log(this.cursens.length);
   },
   error => this.error = error,
   () => this.CompleteGet());
}

completeGet() {
   // the rest of your logic here - only executes on obtaining result.
}

我相信你也可以添加一个。做（），以可观察到的订阅完成同样的事情。

Answer 2:

所有你需要做的就是迫使观察到的更新：

canActivate(): Observable<boolean> {
    return this.authenticated$.take(1);
}

编辑：canActivate等待源可观察来完成的，（最有可能的，我不知道幕后发生的事情），该authenticated$观察到发射.next()而不是.complete()

从技术文档： http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-take
.take(1)方法利用由所述源发射的可观察到的第一个值，然后完成

EDIT2：我只是看着你片段粘贴，我是正确的- store.select()可观察到的无法完成，它总是发出.next

Answer 3:

订阅不返回可观察到的。但是，您可以使用地图运营商这样的：

this.authenticated$.map(
    authenticated => {
        if(authenticated) {
            return true;
        } 
    return false;
    }
 ).first() // or .take(1) to complete on the first event emit

文章来源: How to use an observable in angular 2 guards' canActivate()