Le routage Angular2 peut activer et AuthGuard (JWT) avec paramètre de rôle utilisateur

Dans ce projet exaple avec authentification JWT, nous pouvons vous permettre d'autoriser uniquement les utilisateurs authentifiés vers certains itinéraires:

import { RouterConfig } from '@angular/router'; import { Home } from './home'; import { Login } from './login'; import { Signup } from './signup'; import { AuthGuard } from './common/auth.guard'; export const routes: RouterConfig = [ { path: '', component: Login }, { path: 'login', component: Login }, { path: 'signup', component: Signup }, { path: 'home', component: Home, canActivate: [AuthGuard] }, { path: '**', component: Login }, ]; 

Je voudrais faire un pas plus loin et indiquer également quel rôle d'utilisateur ont «accès» à l'itinéraire – mais je ne sais pas comment passer l'argument à canActivate AuthGuard (src) . Je voudrais donc réaliser quelque chose comme ça (par exemple, j'ai deux rôles: Administrateur et Employé):

  { path: 'home', component: Home, canActivate: [AuthGuard] }, { path: 'users', component: AdminUsers, canActivate: [AuthGuard('Admin')] }, { path: 'users', component: Employees, canActivate: [AuthGuard('Employee')] }, 

Où mon AuthGuard pourrait ressembler à quelque chose comme ça (où UserRole (= Admin ou Employé ou null) est passé au paramètre AuthGuard):

 @Injectable() export class AuthGuard implements CanActivate { constructor(private router: Router) {} canActivate(userRole) { if (!userRole || JWT.user().role == userRole) { return true; } this.router.navigate(['/login']); return false; } } 

Où JWT.user.role est un assistant qui lit le rôle utilisateur stocké dans le jeton JWT. Existe-t-il un moyen de faire quelque chose de similaire à celui de l'idée ci-dessus?

• Le composant "this" de Angular2 est indéfini lors de l'exécution de la fonction de rappel
• Comment réinitialiser les données et la vue de l'entrée enfant sur le clic du bouton du parent, cliquez?
• AngularJS – Les promesses renouent avec des exceptions préservées
• Angular2 – saute le premier élément dans ngFor
• Comment renvoyer une promesse résolue d'un service AngularJS en utilisant $ q?

• Modifier les params sans rechargement en angulaire 2
• Comment accéder à la valeur d'une promesse?
• Comment définir la date d'expiration du cookie dans AngularJS
• Mise en cache d'un objet prometteur dans le service AngularJS

 const appRoutes: Routes = [ { path: 'account/super-secure', component: SuperSecureComponent, canActivate: [RoleGuard], data: { roles: ['super-admin', 'admin'] } }]; 

 ... { path: "customers", component: CustomersCmp, data: { roles: ["admin"] } }, ... 

 public canActivate(route: ActivatedRouteSnapshot): boolean { let path = route._urlSegment.pathsWithParams[0].path; let roles; if (route._routeConfig.path == path) { roles = route._routeConfig.data.roles } else { roles = route._routeConfig.children.find(_route => _route.path == path).data.roles; } if (...) { return true; } return false; }