0

我在我的项目中使用@angular-redux/store。我正在尝试用@select()这样的装饰器创建一个守卫:

@select((s: IAppState) => s.user.userInformations.userState) userState$: Observable<number>;

我的 canActivate 方法是这样的:

canActivate(route, state: RouterStateSnapshot): Observable<boolean> {
    return this.userState$.pipe(map(value => {
      if (value === 0)
        return false;
      return true;
    }));
}

问题是什么? userState $总是返回默认值。(可以说未定义)

到目前为止我尝试了什么? 我试图像这样过滤 Observable:

this.userState$.pipe(skipWhile(val => val === undefined)).subscribe(value => {
  console.log('value', value);
});

它工作正常,返回值是我所期望的(在构造函数中)。但我不能在canActivate方法中使用它。我不知道将数据映射到canActivate.

简而言之:我正在寻找一种方法来跳过状态的第一个值(初始值)并在canActivate方法中将其用作Observable<boolean>.

PS如果我可以配置@angular-redux/store默认跳过 @Select() 装饰器中的 undefiend/initialed 值会更好。

感谢您的帮助。

4

1 回答 1

0

我找到了解决方案!

我们可以Promise用来解决这个问题。并且由于Promise不返回Observable,我们应该使用fromfrom rxjs。最终代码是这样的:

  @select((s: IAppState) => s.user.userInformations.userState) userState$: Observable<number>;
  userStatePromise = new Promise((resolve, reject) => {
    this.userState$.subscribe(val => {
      if (val !== undefined) {
        resolve(val)
      }
    }, (err) => {
      reject(err)
    })
  })

  canActivate(route, state: RouterStateSnapshot): Observable<boolean> {

    return from(this.userStatePromise).pipe(map(val => {
      if (val === 0) {
        // route anywhere you want
        return false;
      }
      return true;
    }))

  }
于 2020-10-05T15:19:19.463 回答