The RouterOutlet Placeholder
In this lesson, we'll learn how to use the RouterOutlet element to load a component for a route.
We'll cover the following...
We’re able to load the <app-home-main> component in the app’s template. However, it’s not what we’re aiming for. We want to load it if the client is requesting the homepage. The Angular Router can help us with this. First, we’ll need to make some modifications to our modules.
Understanding routing
Routing is the idea of tying components to a path in the URL. URLs are mainly comprised of a domain and a path.
Other things make up a URL, but I’m keeping it simple to explain how routes work. The path portion of a URL is where we request specific resources from a server. When the server serves our application, Angular will grab the path from the URL. It will match the path against the routes registered in our application.
Angular will not magically know which path should render which component. It’s our responsibility to tell Angular what to render when a specific URL is visited. This process is what’s known as routing.
It’s not necessary to add routing to an application, but there are a lot of benefits to doing so. Some benefits are: ...