Routing is essential for any frontend framework or library. It makes single page applications possible by letting us load the application once, and display different content to the user through client-side routing.
It’s easy enough to get started with Angular’s router, but have you ever wondered what really happens when you click a link in an Angular application? In this article, we’ll answer this question and more. A lot of insight into Angular can be gained through an understanding of the router’s navigation cycle.
By the end of this article, you will understand the three questions the router must ask itself while navigating:
- Given a URL, which set of components should I navigate to?
- Can I navigate to those components?
- Should I prefetch any data for those components?
Along the way, we’ll see the following, in detail.
- The entire routing process, from start to finish
- How the router builds and uses a tree of ActivatedRouteSnapshot objects during and after navigation.
- Rendering content using directives.
Let’s take a little journey, and see exactly what happens when we route in an Angular application.
#angular #angular-router
