Sharing Top Content from the Angular-sphere.

Implementing Auth Guard with Componentless Route in Angular

  • Implementing Auth Guard with Componentless Route in AngularI see a lot of different implementations of Auth Guards around the web. The implementation is quite simple.
  • In most cases, you will find yourself doing something like this:And then you will add the guard to any protected route.As you see, we need to repeat the same line of code whenever there is a new protected route.
  • Of course, it’s not the end of the world, but we can do better and not write redundant configuration.Let’s use a componentless route as a parent.
  • Componentless routes consume URL segments without instantiating components.Componentless routes are useful when the same configuration apply to all child routesFor example guards, resolvers, params, etc.,Now let’s see how we can achieve the same thing with a componentless route.And we also need to change the method name in our guard.Now every time…
  • 😎You can also achieve the same thing in Angular version 4 with the following code:And that’s how it looks with lazy-load routes:Follow me on Medium or Twitter to read more about Angular, Vue and JS!

I see a lot of different implementations of Auth Guards around the web.
The implementation is quite simple. In most cases, you will find yourself doing something like this: As you see, we need to…

Implementing Auth Guard with Componentless Route in AngularI see a lot of different implementations of Auth Guards around the web. The implementation is quite simple. In most cases, you will find yourself doing something like this:And then you will add the guard to any protected route.As you see, we need to repeat the same line of code whenever there is a new protected route. Of course, it’s not the end of the world, but we can do better and not write redundant configuration.Let’s use a componentless route as a parent. Componentless routes consume URL segments without instantiating components.Componentless routes are useful when the same configuration apply to all child routesFor example guards, resolvers, params, etc.,Now let’s see how we can achieve the same thing with a componentless route.And we also need to change the method name in our guard.Now every time you navigate to /todos or /blog route, the AuthGuard will run. 😎You can also achieve the same thing in Angular version 4 with the following code:And that’s how it looks with lazy-load routes:Follow me on Medium or Twitter to read more about Angular, Vue and JS!

Implementing Auth Guard with Componentless Route in Angular

Comments are closed, but trackbacks and pingbacks are open.