Learn TypeScript 3 by Building Web Applications

Adding a toolbar

Let's start our user interface refresh by adding a toolbar. You can find examples here: https://material.angular.io/components/toolbar/overview.

To use Angular Material components, you need to import their corresponding modules separately. You can do so at the application level (that is, in the App module) or, rather, in specific modules if you only plan to use these in particular parts of your application.

The Angular Material documentation actually proposes two different approaches. Either you import the modules for the components you need in each module, or you create a shared module in which you import those and reexport them.

Since we already have a shared module in place, we'll use the latter approach.

Adapt the src/app/shared/shared.module.ts ...