What are the different Guards present in Angular?

Guards in Angular help us in controlling access to certain routes of our application, unless a criteria is matched. Angular provides the following interfaces for us to implement and create Guards for required use cases:

  1. CanActivate - navigation to an individual route corresponding to a component
  2. CanActivateChild - navigation to all the child routes and components of a specific route
  3. CanDeactivate - guards the exit from a component route and allows on a matching criteria
  4. CanLoad - lets the application lazyload all the routes of a module only if a condition is met
  5. Resolve - helps in prefetching all the component data before the route is activated.

Guards in Angular help us in controlling access to certain routes of our application, unless a criteria is matched. Angular provides the following interfaces for us to implement and create Guards for required use cases:

  1. CanActivate – navigation to an individual route corresponding to a component
  2. CanActivateChild – navigation to all the child routes and components of a specific route
  3. CanDeactivate – guards the exit from a component route and allows on a matching criteria
  4. CanLoad – lets the application lazyload all the routes of a module only if a condition is met
  5. Resolve – helps in prefetching all the component data before the route is activated.

Buy Me A Coffee

Found this article helpful? Please consider supporting!

Ram
Ram

I'm a full-stack developer and a software enthusiast who likes to play around with cloud and tech stack out of curiosity. You can connect with me on Medium, Twitter or LinkedIn.

Leave a Reply

Your email address will not be published. Required fields are marked *