Передача параметров в Guard углового 2

Question

У меня есть приложение, которое я имею установку с Authentication Guard, чтобы сделать, что пользователи не могут получить доступ к приложению, если они не вошли в системе, как и

import { Injectable } from '@angular/core'; 
import { 
    CanActivate, Router, 
    ActivatedRouteSnapshot, 
    RouterStateSnapshot, 
    CanActivateChild } from '@angular/router'; 
import { AuthContext } from './auth-context.service'; 

@Injectable() 
export class AuthGuard implements CanActivate { 
     constructor(private router: Router, private authContext: AuthContext) { } 

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { 
     // Check to see if a user has a valid JWT 
     if (this.authContext.userInfo !== undefined && this.authContext.userInfo.isAuthenticated) { 
      // If they do, return true and allow the user to load the home component 
      return true; 
     } 

     // If not, they redirect them to the login page 
     this.router.navigate(['/login']); 
     return false; 
    } 

    canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { 
     return this.canActivate(route, state); 
    } 
} 

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

<div *ngIf="userInRole('Admin')"> 
      This is secret stuff 
</div> 

Но если пользователь знает маршрут, он может просто подключить его к URL-адресу. Как я могу добавить функцию «userInRole()» в Guard? Мне нужно было бы передать имя роли и сделать код проверки. Помогают ли гвардии параметры?

Answer 1

Охранник - это всего лишь класс, который реализует CanActivate или CanDeactivate. Но ничто не мешает вам вводить услугу (или значение), которая вернет вам роль пользователя. Например,

export class AuthGuard implements CanActivate { 
     constructor(private router: Router, private authContext: AuthContext, 
      private user: MyUserService) { } 

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { 
      if (!this.user.isAdmin()) return false; 
      ... 

    } 
} 

Answer 2

Я нашел решение этой

import { Injectable } from '@angular/core'; 
    import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; 
    import { Observable } from 'rxjs/Observable'; 

    @Injectable() 
    export class IsInRoleGuard implements CanActivate { 
     constructor(
     ) { } 

     canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean { 
      if (['admin', 'super'].indexOf(next.data['roles']) !== -1) {//We Are getting the roles from the data 

       return true; 
      } 
      return false; 
     } 
    } 

и в маршрутизаторе-конфигурации

import { Routes, RouterModule } from '@angular/router'; 
import { ModuleWithProviders } from '@angular/core'; 
import { RootComponent } from './root/root.component'; 
import { DashboardComponent } from './dashboard/dashboard.component'; 
import { IsInRoleGuard } from '../../guards/is-in-role.guard'; 

const routes: Routes = [ 
    { 
     path: '', component: RootComponent, children: [ 
      { 
       path: '', pathMatch: 'full', component: DashboardComponent, data: { 
        roles: [ 
         'admin', 
         'super-admin' 
        ] 
       } 
      } 
     ] 
    } 
]; 

export const RouterConfig: ModuleWithProviders = RouterModule.forChild(routes);