如何将参数传递给canActivate的构造函数？

Question

我有以下路线路径：

{
    path: 'teacher',
    component: DashboardTeacher, canActivate: [AccessGuardTeacher('Teacher')]
}

如您所见，我尝试在课堂上传递参数“Teacher” AccessGuardTeacher：

export class AccessGuardTeacher implements CanActivate {

  constructor(private role: string) {
  }
}

怎么做才对？

Answer 1

您的路由应配置为：

{ 
   path: 'teacher', 
   component: DashboardTeacherComponent, 
   canActivate: [AccessGuardTeacher], 
   data: { 
            role: 'teacher'
         } 
}

在您的 CanActivate Guard 中获取您的路线数据

export class AccessGuardTeacher implements CanActivate {

     constructor() {
     }

    canActivate(route: ActivatedRouteSnapshot): boolean {

        const role = route.data.role;
        return true; //based on your condition
    }
}

Answer 2

Angular 14+ 解决方案

{
    path: 'edit',
    component: Cmp,
    canActivate: [
      () =>
        inject(Service).hasUserPermissions(['WRITE_SOMETHING'])
          ? true
          : inject(Router).parseUrl('/goSomewhere'),
    ],
  },