angular-material2 Getting started with angular-material2 Installation or Setup with Angular CLI

Example

In this example, we will be using @angular/cli (latest) and the latest version of @angular/material. You should at least know the basics of Angular 2/4 before continuing the steps below.

1. Install angular material module from npm:

   npm install @angular/material --save
   

npm install @angular/animations --save

npm install @angular/cdk --save

2. In your application module import the components which you are going to use:

   import { NgModule } from '@angular/core';
   import { CommonModule } from '@angular/common';
   import { RouterModule } from '@angular/router';
   import { MdButtonModule, MdSnackBarModule, MdSidenavModule } from '@angular/material';
   
   import { AppComponent } from './app.component';
   
   import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
   
   @NgModule({
        imports: [
            BrowserAnimationsModule,
            MdButtonModule,
            MdSnackBarModule,
            MdSidenavModule,
            CommonModule,
            // This is optional unless you want to have routing in your app
            // RouterModule.forRoot([
            //     { path: '', component: HomeView, pathMatch: 'full'}
            // ])
        ],
        declarations: [ AppComponent ],
        boostrap: [ AppComponent ]
   })
   export class AppModule {}
   

You are now ready to use Angular Material in your components!

Note: The docs for specific components will be coming soon.

PDF - Download angular-material2 for free