Передать параметр в защиту маршрута

Я работаю над приложением, у которого есть много ролей, которые мне нужно использовать для блокировки навигации к частям приложения на основе этих ролей. Я понимаю, что могу создавать отдельные классы защиты для каждой роли, но предпочитаю иметь один класс, в который я мог бы каким-то образом передать параметр. Другими словами, я хотел бы сделать что-то подобное:

{ 
  path: 'super-user-stuff', 
  component: SuperUserStuffComponent,
  canActivate: [RoleGuard.forRole('superUser')]
}

Но поскольку все, что вы передаете, - это имя типа вашего охранника, не могу придумать, как это сделать. Должен ли я просто укусить пулю и написать отдельные классы защиты для каждой роли и разрушить мою иллюзию элегантности, имея вместо этого один параметризованный тип?

Вместо использования forRole()вы можете сделать это:

{ 
   path: 'super-user-stuff', 
   component: SuperUserStuffComponent,
   canActivate: RoleGuard,
   data: {roles: ['SuperAdmin', ...]}
}

и используйте это в своем RoleGuard

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot)
    : Observable<boolean> | Promise<boolean> | boolean  {

    let roles = route.data.roles as Array<string>;
    ...
}

Вот мой взгляд на это и возможное решение проблемы с отсутствующим поставщиком.

В моем случае у нас есть охранник, который принимает разрешение или список разрешений в качестве параметра, но это то же самое, что имеет роль.

У нас есть класс для работы с охранниками авторизации с разрешения или без разрешения:

@Injectable()
export class AuthGuardService implements CanActivate {

    checkUserLoggedIn() { ... }

Это касается проверки активного сеанса пользователя и т. Д.

Он также содержит метод, используемый для получения настраиваемой защиты разрешений, которая фактически зависит от AuthGuardServiceсамого

static forPermissions(permissions: string | string[]) {
    @Injectable()
    class AuthGuardServiceWithPermissions {
      constructor(private authGuardService: AuthGuardService) { } // uses the parent class instance actually, but could in theory take any other deps

      canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        // checks typical activation (auth) + custom permissions
        return this.authGuardService.canActivate(route, state) && this.checkPermissions();
      }

      checkPermissions() {
        const user = ... // get the current user
        // checks the given permissions with the current user 
        return user.hasPermissions(permissions);
      }
    }

    AuthGuardService.guards.push(AuthGuardServiceWithPermissions);
    return AuthGuardServiceWithPermissions;
  }

Это позволяет нам использовать метод для регистрации некоторых настраиваемых охранников на основе параметра разрешений в нашем модуле маршрутизации:

....
{ path: 'something', 
  component: SomeComponent, 
  canActivate: [ AuthGuardService.forPermissions('permission1', 'permission2') ] },

Интересная часть forPermissionзаключается AuthGuardService.guards.pushв том, что это в основном гарантирует, что каждый раз, когда forPermissionsвызывается для получения настраиваемого класса защиты, он также сохраняет его в этом массиве. Это также статично для основного класса:

public static guards = [ ]; 

Затем мы можем использовать этот массив для регистрации всех охранников - это нормально, если мы убедимся, что к тому времени, когда модуль приложения зарегистрирует этих поставщиков, маршруты были определены и все классы защиты были созданы (например, проверьте порядок импорта и держите этих провайдеров как можно ниже в списке - помогает наличие модуля маршрутизации):

providers: [
    // ...
    AuthGuardService,
    ...AuthGuardService.guards,
]

Надеюсь это поможет.

Решение @AluanHaddad выдает ошибку «нет провайдера». Вот исправление для этого (это кажется грязным, но у меня нет навыков, чтобы исправить это).

По сути, я регистрирую как поставщик каждый динамически генерируемый класс, созданный с помощью roleGuard.

Итак, для каждой проверенной роли:

canActivate: [roleGuard('foo')]

у вас должно быть:

providers: [roleGuard('foo')]

Однако решение @AluanHaddad как есть будет генерировать новый класс для каждого вызова roleGuard, даже если rolesпараметр тот же. Использование lodash.memoizeэто выглядит так:

export var roleGuard = _.memoize(function forRole(...roles: string[]): Type<CanActivate> {
    return class AuthGuard implements CanActivate {
        canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):
            Observable<boolean>
            | Promise<boolean>
            | boolean {
            console.log(`checking access for ${roles.join(', ')}.`);
            return true;
        }
    }
});

Обратите внимание, что каждая комбинация ролей генерирует новый класс, поэтому вам необходимо зарегистрировать в качестве поставщика каждую комбинацию ролей. Т.е. если у вас есть:

canActivate: [roleGuard('foo')]и canActivate: [roleGuard('foo', 'bar')]вам нужно будет зарегистрировать оба:providers[roleGuard('foo'), roleGuard('foo', 'bar')]

Лучшим решением было бы автоматически регистрировать поставщиков в глобальной коллекции поставщиков внутри roleGuard, но, как я уже сказал, мне не хватает навыков для этого.