Enhancing navigation with advanced features
So far, we have covered basic routing with route and query parameters. The Angular router is quite capable, though, and able to do much more, such as the following:
- Controlling access to a route
- Preventing navigation away from a route
- Prefetching data to improve application UX
- Lazy-loading routes to speed up response time
In the following sections, we will learn about all these techniques in more detail.
Controlling route access
When we want to control access to a particular route, we use a guard. To create a guard, we use the ng generate
command of the Angular CLI, passing the word guard
and its name as parameters:
ng generate guard auth
When we execute the previous command, the Angular CLI asks what type of guard we would like to create. There are multiple types of guards that we can create according to the functionality that they provide:
CanActivate
: Controls whether a...