Angular 6 for Enterprise-Ready Web Applications

Manager module

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 throughout ManagerModule, we can create a consistent UX for navigating subpages across modules.

For this to work, we need to replicate the parent-child relationship between app.component and home/home.component, where the parent implements the toolbar and a <router-outlet> so that children elements can be rendered in there: ...