CanDeactivate Route Guards with Angular
This Article helps you to Understand, How To Use CanDeactivate Route Guards with Angular?
The CanDeactivate guard differs slightly from other implementations in that the component to be deactivated must be supplied. This enables us to check for things like unsaved changes by probing the component in question.
now to make sure that if user tries to accidentally navigate away, then we prevent them doing so or at least ask them if he really wants to leave.
Using the CanDeactivate Route Guard
Use Route Guard
In order to use them, route guards should be provided like services.so we have to register our Guard in app.module.ts
Define Which Route should be Protected by these Guards
And then lastly, you’ll want to add the guard as part of your routing configuration.
Implement this Guard in Component