Create Application Layout with Components in an Angular CLI Project

Bram Borggreve
InstructorBram Borggreve

Share this video with your friends

Send Tweet

In this lesson we will our UiModule, that has a LayoutComponent, HeaderComponent and FooterComponent.

We generate UiModule by running the following command:

ng generate module ui --module app

This generates the new module and imports it in our AppModule.

We'll create the LayoutComponent using:

ng generate component ui/containers/layout
ng generate component ui/containers/header
ng generate component ui/containers/footer

We update our AppRoutingModule and add this component to our first route to make it visible.

The HeaderComponent and FooterComponent are referenced in the LayoutComponent and we implement the actual templates!