Angular Material - Set up theme gesture support and material icons in angular material2 - Angular Material Tutorial

A theme is required for material components to work properly within the application.

Angular Material 2 provides four prebuilt themes:

deeppurple-amber indigo-pink pink-bluegrey purple-green

If you are using Angular CLI, you can import one of the prebuilt themes in style.css

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

Theme can be added using <link> in index.html as well.

Add HammerJS to the application via CDN or npm:

Add HammerJS to the application via CDN or npm:

Add HammerJS to the application via CDN or npm:

npm install --save hammerjs

In your root module, usually app.module.ts, add the import statement:

import 'hammerjs';

Unless, custom icons provided, Angular Material 2 <md-icon> expects Material Icons.

In index.html add:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

This angular material provides most of the technology areas such as angular material example , angular material download , angular material design template , angular material vs bootstrap , angular material for angular 2 , what is angular material , angular material demo , angular material2 , angular material demo , angular 4 material , angular material npm , angular material tutorial , angular material cdn , angular material vs bootstrap