【问题标题】:Implement Router Guard Based on NGRX Store基于NGRX Store实现Router Guard
【发布时间】:2019-09-18 22:49:08
【问题描述】:

我想根据 store 中的值实现路由器保护。如果用户登录到应用程序,我想获取该用户的角色并激活我的子模块路由的某些路由。

我将发布我当前的实现,但这根本不起作用

p.s 我没有使用 Angular 路由器商店

canActivate(): {
   return this.store.pipe(select(selectUser)).pipe(
      skip(1),
      map((user) => {
        const userObj: any = user
        if (userObj.userRole === "Admin") {
          this.router.navigateByUrl('admin/tourprovider/genaral-infomation');
          return true;
        } else {
          this.router.navigateByUrl('home')
          return false;
        }

      })
     )
    }

【问题讨论】:

  • 但这根本不起作用更具体地说,发生了什么?
  • 它不会导航到家或相关路线。只显示页眉和页脚。
  • 您使用的是哪家商店?本地存储?
  • @AbdulAleem nope ngrx 商店
  • 代替skip(1) 尝试take(1) 或不使用skip(1)。另外,检查开发工具(控制台)中是否有异常。

标签: angular ngrx-store angular-router-guards


【解决方案1】:

我会这样尝试:

private user$: Observable<any>;
constructor(
    private store: Store<{ user: string }>,
    private router: Router
  ) {
  this.user$ = store.pipe(select('user'));
}

canActivate(): {
  return this.user$.pipe(
    take(1),
    tap((user) => console.log(user)), // Just to test if user do have a value
    map((user: any) => (user.userRole  === "Admin") ? true : this.router.parseUrl('/home'))
  );
}

【讨论】:

  • 这项工作,但是当用户角色是管理员时出现问题我想被重定向到管理员门户触发无限循环。可能是什么问题
  • 你什么时候使用这个保护?因为仅当您尝试访问特定路线并且如果您有权访问(是管理员)时才应使用警卫,如果没有,他会让您通过,否则您将被重定向到 /home 路线。如果你有访问权限,它不应该重定向。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2017-09-16
  • 1970-01-01
  • 2019-02-24
  • 2019-01-19
  • 1970-01-01
  • 2018-06-20
  • 1970-01-01
相关资源
最近更新 更多