According to the documentation at https://material.angular.io: Angular Material has “Internationalized and accessible components for everyone”. The key word in this statement is the word ‘components’. The Angular Material Components allow for great User Interface designs as well as the Typescript that controls the behavior of the components.

In order to install Angular Material one must have an Angular Project set up with the CLI. Once this is completed one can install Angular Material into the project with the following command.

ng add @angular/material

Once this command has installed the necessary dependencies and everything one should be ready to import the required components. For this example we will be using an Angular Material Table. In order to do so we must first install the required Angular Material modules. In the app.module.ts file one is to import the following Angular Material Components.

import { MatTableModule } from '@angular/material/table';

import { MatCardModule } from '@angular/material/card';

Now one is able to add the MatTableModule and MatCardModule to the imports array in the NgModule of the app.module.ts file. One these imports are added one is now able to use the Material Table and Material Card components.

Here is an example of the Angular Material Table. Notice the columns are just titles.

Now the associated Typescript file will look like such.

import { Component } from '@angular/core';

@Component({

selector: 'app-root',

templateUrl: './app.component.html',

styleUrls: ['./app.component.scss']

})

export class AppComponent {

blogPosts: any = [{ "title": "My First Post" }, { "title": "My second post" }];

displayedColumns: string[] = ['title']

}

Then with the next command one will be able to see the project in the browser.

ng serve

The project should now look like this is in the browser on port 4200!

There are many other components that can be used with the Angular Materials. The list of different components can be found at: https://material.angular.io/components. There are some interesting components such as MatInput; MatButton and MatList.