Creating More Routes
In this lesson, we'll get some practice with modules and routing.
We'll cover the following
Let’s do an exercise. We were able to create a routing module to load the HomeComponent
to display the content for the home page. There are two other pages we’ll want to make routes for. They’re the about and contact pages. We’ve already taken the first steps by creating modules for each page. The next step is to create components and route them.
Try doing this exercise on your own. Here are the series of steps you’ll need to take to accomplish this:
- Create a component for the contact page.
- Define a new route in the
contact
routing module. - Import the
contact
module in theapp
module. - Add the
contact
module to theimports
option. - Repeat this for the
about
page.
Good luck!
The solution
I won’t leave you hanging. Below the solution for the exercise. For this portion, we’ll be tackling both pages at the same time.
Creating components
In the command line, run the following commands for the contact
component:
ng generate component contact/contact-main
Run this command for the about
component:
ng generate component about/about-main
Here’s what should’ve been generated:
Get hands-on with 1200+ tech skills courses.