Using the sitemap, we have created for LemonMart, from earlier in the chapter, we need to complete the walking skeleton navigation experience for the app. In order to create this experience, we will need to create some buttons to link all modules and components together. We will go to this module by module:
- Before we start, update the login button on
home.component
to link to theManager
module:
src/app/home/home.component.ts
...
<button mat-raised-button color="primary" routerLink="/manager">Login as Manager</button>
...
Since we already enabled lazy loading for ManagerModule
, let's go ahead and complete the rest of the navigational elements for it.
In the current setup, ManagerHomeComponent
renders in the <router-outlet>
defined in app.component
, so when the user navigates from HomeComponent
to ManagerHomeComponent
, the toolbar implemented in app.component
remains a constant. If we implement a similar toolbar that persists...