Exploring the concept of guards in Angular has sparked a question in my mind. Why can't we simply have a class with a deactivate method that we can import and use as needed?
The provided code snippets illustrate my confusion.
export interface CanComponentDeactivate {
canDeactivate: () => Observable<boolean> | Promise<boolean> | boolean
// We define an interface with a method named 'canDeactivate'
}
export class canDeactivateGuard implements CanDeactivate<CanComponentDeactivate> {
/*
I struggle to understand how our custom interface 'CanComponentDeactivate' is related to the predefined interface,
and why we cannot directly utilize the canDeactivate method within it. If this limitation is tied to Angular's internal structure,
then please let me know so I can adapt accordingly.
*/
canDeactivate(component: CanComponentDeactivate,
currentRoute: ActivatedRouteSnapshot,
currentState: RouterStateSnapshot,
nextState: RouterStateSnapshot): boolean | Observable<boolean> | Promise<boolean> {
return true
}
}
If this restriction is due to Angular's framework design, clarity on the rationale would be greatly appreciated. Is there a specific reason why we are unable to simplify the process by utilizing the Deactivate interface directly?