Angular Material is used to display rows of data and styled data tables. The Angular Material Data Table component is a generic component for displaying tabulated data. We can easily give it the finest look and feel with the material design.

MatTable is built on the foundation of the Component Dev Kit (CDK) data-table and uses a similar interface for its data input and template. Its element and attribute selectors are prefixed with mat- instead of CDK. The use of CDK is a library of predefined behaviors included in Angular Material, a UI component library for Angular developers and CDK contains reusable logics for many features. Let’s discuss how you can create your own generic MatTable with Angular components.

Angular Material Table

Install an Angular 8, we are using Angular CLI Version 8 for this tutorial demonstration. If you’re new to Angular, I recommend you to follow these steps with Angular 8.

Install Angular 8

Type the following command to install Angular.

install -g @angular/cli

Now, generate the Angular project using this command below.

ng new mat-table-example

#angular #material design