CanDeactivate interface
CanDeactivate interface
This is the documentation for Angular 6.
You can switch to the latest version Angular 8.
You can switch to the latest version Angular 8.
Interface that a class can implement to be a guard deciding if a route can be deactivated.
interface CanDeactivate<T> {
canDeactivate(component: T, currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot, nextState?: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean
}
Example
class UserToken {}
class Permissions {
canDeactivate(user: UserToken, id: string): boolean {
return true;
}
}
@Injectable()
class CanDeactivateTeam implements CanDeactivate<TeamComponent> {
constructor(private permissions: Permissions, private currentUser: UserToken) {}
canDeactivate(
component: TeamComponent,
currentRoute: ActivatedRouteSnapshot,
currentState: RouterStateSnapshot,
nextState: RouterStateSnapshot
): Observable<boolean>|Promise<boolean>|boolean {
return this.permissions.canDeactivate(this.currentUser, route.params.id);
}
}
@NgModule({
imports: [
RouterModule.forRoot([
{
path: 'team/:id',
component: TeamCmp,
canDeactivate: [CanDeactivateTeam]
}
])
],
providers: [CanDeactivateTeam, UserToken, Permissions]
})
class AppModule {}
You can alternatively provide a function with the canDeactivate
signature:
@NgModule({
imports: [
RouterModule.forRoot([
{
path: 'team/:id',
component: TeamCmp,
canDeactivate: ['canDeactivateTeam']
}
])
],
providers: [
{
provide: 'canDeactivateTeam',
useValue: (component: TeamComponent, currentRoute: ActivatedRouteSnapshot, currentState:
RouterStateSnapshot, nextState: RouterStateSnapshot) => true
}
]
})
class AppModule {}