How to Add Angular Material in an Angular App
Angular Material is a library of UI components. Angular Material offers cutting-edge user interface components that are compatible with desktop, online, and mobile platforms. By reusing common components like cards, attractive inputs, data tables, and so forth, Angular Material can speed up the development process.
The angular Material style might serve as a blueprint for a cohesive visual, motion, and interaction design system that works with a variety of screens and devices. It is producing websites that are responsive, appealing, and speedier.
Install Angular Material, Angular CDK and Angular Animations
npm install @angular/material @angular/cdk @angular/animations --save
npm cache clean --force
Update Material Dependencies
Use following command to update your Angular project with the correct dependencies, perform configuration changes and execute initialization code.
ng add @angular/material
this will ask few questions about your choice, asnwer it as per your requirement.
Import the Angular Material component modules and configure animations
Create a folder shared under the app folder. In the shared folder, create a file named material.module.ts:
if the Angular/material version is less than or equal 8.0.0 the import
if Material version is higher than 8, Import statements should be more sepecific
Import this module into our app.module.ts :
Create Angular Material Layout
What's Your Reaction?