26 Routing and navigation: part 3
This chapter covers
- Using resolvers and route guards to control route activation
- Displaying placeholder content to the user until data is loaded
In this chapter, I continue to describe the Angular URL routing system, focusing on the most advanced features. I explain how to control route activation, how to load feature modules dynamically, and how to use multiple outlet elements in a template. Table 26.1 summarizes the chapter.
Table 26.1. Chapter summary
Problem
|
Solution
|
Listing
|
Delaying navigation until a task is complete
|
Use a route resolver
|
1–6
|
Preventing route activation
|
Use an activation guard
|
7–13
|
Preventing the user from navigating away from the current content
|
Use a deactivation guard
|
14–17
|
26.1 Preparing the example project
For this chapter, I will continue using the exampleApp project that was created in chapter 20 and has been modified in each subsequent chapter. No changes are required for this chapter.
Tip
You can download the example project for this chapter—and for all the other chapters in this book—from https://github.com/manningbooks/pro-angular-16. See chapter 1 for how to get help if you have problems running the examples.
Open a new command prompt, navigate to the exampleApp folder, and run the following command to start the server that provides the RESTful web server:
npm run json
Open a separate command prompt, navigate to the exampleApp folder, and run the following command to start the Angular development tools:
ng serve