Child Routes
In this lesson, we will learn how to add child routes to an existing route.
We'll cover the following
We have an about page that we’re going to transform. We’ll add some dummy sections to it where visitors can view a short bio and learn about the team, and some past clients. We’ll take it a step further by putting each section into a child route.
What is a child route?
We can create a hierarchy out of our routes. In some cases, we’ll want routes to be children of other routes. For example, here’s what we’ll want the routes for the about page to look like.
/about
: display the bio/about/team
: display the team/about/clients
: Displays clients
We’ll create a component for each page. The components should only get rendered if they’re on the /about
path.
Creating the components
We’ll quickly run through the process of creating the components. In the command line, run the following command for the bio section:
ng generate component about/bio
For the team section:
ng generate component about/team
For the clients section:
ng generate component about/clients:
Defining child routes
One solution for creating child routes is to add them to the app
routing module.
Get hands-on with 1200+ tech skills courses.