基于Angular 5角色的路由激活

// 定义角色
enum UserRole {
  Admin = 'admin',
  User = 'user'
}

// 创建路由守卫
@Injectable()
class RoleGuard implements CanActivate {
  constructor(private authService: AuthService) {}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean> | Promise<boolean> | boolean {
    const userRole = this.authService.getUserRole(); // 获取用户角色
    const requiredRole = route.data.requiredRole; // 获取路由配置中指定的所需角色

    // 根据用户角色和所需角色进行判断
    if (userRole === requiredRole) {
      return true; // 允许访问路由
    } else {
      return false; // 不允许访问路由
    }
  }
}

// 配置路由守卫
const routes: Routes = [
  { 
    path: 'admin',
    component: AdminComponent,
    canActivate: [RoleGuard], // 应用路由守卫
    data: { requiredRole: UserRole.Admin } // 指定所需角色为管理员
  },
  { 
    path: 'user',
    component: UserComponent,
    canActivate: [RoleGuard], // 应用路由守卫
    data: { requiredRole: UserRole.User } // 指定所需角色为普通用户
  }
];

// 在模块中提供路由守卫
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  providers: [RoleGuard]
})
export class AppRoutingModule { }