Install Angular material in Angular 8

In this article, i am going to explain how to install material design in angular 8.So please follow the step by step approach to install material design in angular 8 project.


Step 1:


I hope you already created a sample angular 8 application using the following command with angular CLI command line interface.
Eg:- C:\>ng new angular8examples

Step 2:

INSTALL ANGULAR 8 MATERIAL and ANGULAR CDK


Now give following command to install angular material Eg:- C:\angular8examples>npm install @angular/material After installation it will throw this warnings:npm WARN @angular/material@8.2.3 requires a peer of @angular/cdk@8.2.3 but none is installed. You must install peer dependencies yourself. Solution :You need to install @angular/cdk then only you can run and see the output of angular material components like mat table,mat input etc

Step 3:

INCLUDE THE MATERIAL MODULES IN APP.MODULE.TS


Next is to add what ever material modules you are going to use in your project in app.module.ts, import { MatTableModule } from '@angular/material'; @NgModule({ imports: [ // ... MatTableModule // ... ]})

Step 4:

INCLUDE THEME IN STYLE.CSS


Open style.css, and include following theme, @import '~@angular/material/prebuilt-themes/deeppurple-amber.css'; There are other builtin themes exist they are: deeppurple-amber.css
indigo-pink.css
pink-bluegrey.css
purple-green.css

CONCLUSION :


Thats it guys, you are now ready to use any angular material design components in your project.
Happy Designing!