访问canActivate Guard中的ActivatedRoute组件

时间:2017-12-06 17:04:04

标签: angular typescript angular-routing angular-router angular-router-guards

据我所知,canActivate的通话签名如下:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

}

我有一个服务需要一个组件的名称并返回访问该组件所需的用户角色,这样我就可以检查我的后卫的canActivate功能,活动用户是否具有相应的角色或不。 我的问题是,我不知道如何访问该组件。经过一些谷歌搜索后,我找到了这样的解决方案:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
  const nameOfComponent = route.routeConfig.component.name;
  return doSomeRoleCheck(nameOfComponent);
}

但在我的情况下,我只是得到一个错误:“无法读取未定义的'propate'名称'。如何访问活动路由的组件或特别是名称作为字符串?

修改

我发现,我确实在父路线上检查了这个警卫。当我在儿童路线中检查它时它起作用。如何从父ActivatedRouteSnapshot

访问子组件

1 个答案:

答案 0 :(得分:3)

这样的事情可能适合你的情况:

export abstract class RoleCheck {
  myRoles: string[];
}

@Component({ ... })
export class YourComponent extends RoleCheck {
  public myRoles = ['User', 'Admin'];
}

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
  if (!route.routeConfig.component instanceof RoleCheck) {
    //Throw
  }
  return doSomeRoleCheck(route.routeConfig.component.myRoles)
}