CanActivate

Stable

Interface

What it does

Interface that a class can implement to be a guard deciding if a route can be activated.

How to use

  1. class UserToken {}
  2. class Permissions {
  3. canActivate(user: UserToken, id: string): boolean {
  4. return true;
  5. }
  6. }
  7. @Injectable()
  8. class CanActivateTeam implements CanActivate {
  9. constructor(private permissions: Permissions, private currentUser: UserToken) {}
  10. canActivate(
  11. route: ActivatedRouteSnapshot,
  12. state: RouterStateSnapshot
  13. ): Observable<boolean>|Promise<boolean>|boolean {
  14. return this.permissions.canActivate(this.currentUser, route.params.id);
  15. }
  16. }
  17. @NgModule({
  18. imports: [
  19. RouterModule.forRoot([
  20. {
  21. path: 'team/:id',
  22. component: TeamCmp,
  23. canActivate: [CanActivateTeam]
  24. }
  25. ])
  26. ],
  27. providers: [CanActivateTeam, UserToken, Permissions]
  28. })
  29. class AppModule {}

You can alternatively provide a function with the canActivate signature:

  1. @NgModule({
  2. imports: [
  3. RouterModule.forRoot([
  4. {
  5. path: 'team/:id',
  6. component: TeamCmp,
  7. canActivate: ['canActivateTeam']
  8. }
  9. ])
  10. ],
  11. providers: [
  12. {
  13. provide: 'canActivateTeam',
  14. useValue: (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => true
  15. }
  16. ]
  17. })
  18. class AppModule {}

Interface Overview

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

}

Interface Description

Interface Details

exported from @angular/router/index, defined in @angular/router/src/interfaces.ts