Question

我有这个路线保护，应该检查用户的角色以及路线定义中定义的roleAccess属性。

我面临的问题是.map无论accounts.isSelfPending如何都会执行，只有当它为假时（null开始为@ngrx/store）它应该允许.map运行。

我怎样才能做到这一点？

编辑：我意识到我的问题可能有点含糊不清，我需要等待来自/self请求的用户信息更高组件层次结构，并存储在商店中。

现在的问题是/self请求即使在我的DashboardComponent中被解雇也不会被解雇，而AdsComponent又将/self作为其中之一保留＃39} ;路由中的孩子们。（这是我目前试图锁定这名警卫的路线。）

为什么它甚至没有触发return this.store.select('accounts') .let((state: Observable<IAccountsStorage>) => state.filter((accounts: IAccountsStorage) => accounts.isSelfPending !== null && accounts.isSelfPending === false))) .map((accounts: IAccountsStorage) => { this.route.data.subscribe( data => { if (accounts.self) { if (accounts.self.role !== data['roleAccess'] && (data['roleAccess'] !== 0 || data['roleAccess'] !== undefined || data['roleAccess'] !== null)) { return this.router.navigateByUrl('admin/dashboard'); } else { return true; } } } ); } ).first();请求？我认为这是这个问题的一部分。

state == 1

Answer 1

一年之后我就知道了，但我在Angular的Stores and Guards也有类似的问题。我认为你的问题与最初拥有NULL用户对象的State有关 - 即使只是在你从现有令牌设置用户时只是短暂的。

NULL首先出现但需要过滤掉，如下所示：

canLoad(route: Route): Observable<boolean> | Promise<bolean> | boolean {
    return this.store.select(fromRoot.getUser)
        .filter(user => user != null) // ** THIS IS THE KEY TO SKIP NULL USER **
        .map(user => {
            //code t check user role
        }).take(1); // or .first() -- doesn't seem to be necessary for canActivate guards
}

注意：上面的代码反映了商店代码编写的当前方式 - 或者至少是按照当前ngrx/store 4.x code examples的编写方式进行了图案化，与原始问题中使用的结构不同。

Answer 2

在意识到使用商店作为中间人造成了太多问题后，我决定直接打电话给api，结果是一个更加清晰的后卫，实际上是按预期工作的。

我认为这可能有助于其他人，所以我会在这里留下最终解决方案：

canLoad(): Observable<boolean> {

  return this.accountsApi.getSelf()
    .map(res => {

      if (res.data.role === 1) {
        return true;
      }
      else {
        return this.router.navigate(['admin/dashboard']);
      }
    })
    .catch(err => {
      return this.router.navigate(['admin/dashboard']);
  });
}

但是，如果有人知道如何用原始代码解决问题，请提供它，因为我很好奇如何使用商店实际做到这一点。

Angular 2路线卫士不等待设定值

2 个答案: