From the course: Building Angular and ASP.NET Web API Apps

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Designing a header and footer

Designing a header and footer

From the course: Building Angular and ASP.NET Web API Apps

Start my 1-month free trial

Designing a header and footer

“

- [Male Speaker] On this part, we are going to design the header and the footer of our application. And to do so, we are going to use the toolbar module. So, let us go and configure this module. In your app.module.ts, import the MatToolbarModule. So for that, in line 17, write MatToolbarModule. Now that we imported this module to be able to use it we need to include it in our import section. So for that, we write in here MatToolbarModule and save the changes. Let us start with the footer. So, let's go to the footer, then inside the footer, go to the footer.component.html, and instead of using a paragraph, we are going to use a mat-toolbar. So, mat-toolbar. And then close the tag. So, save the changes and run the application to see the result. So for that, in terminal, write ng serve -o. So here we see that the toolbar is now different. Let us do the same with the header. For that, let us go to the header folder and inside here, go to the header.component.html. The same way, let us…

Contents