CanDeactivateFn
Type Alias
The signature of a function used as a canDeactivate guard on a Route.
API
type CanDeactivateFn<T> = ( component: T, currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot, nextState: RouterStateSnapshot,) => MaybeAsync<GuardResult>
Description
The signature of a function used as a canDeactivate guard on a Route.
If all guards return true, navigation continues. If any guard returns false,
navigation is cancelled. If any guard returns a UrlTree, the current navigation
is cancelled and a new navigation begins to the UrlTree returned from the guard.
The following example implements and uses a CanDeactivateFn that checks whether the
user component has unsaved changes before navigating away from the route.
@Component({ template: '', standalone: false,})export class UserComponent { hasUnsavedChanges = true;}bootstrapApplication(App, { providers: [ provideRouter([ { path: 'user/:id', component: UserComponent, canDeactivate: [(component: UserComponent) => !component.hasUnsavedChanges], }, ]), ],});
Jump to details