Integration with AngularMaterial2

Quick guide to integrating Angular Material

An example can be found here.

1. Add the NPM packages.

npm install --save @angular/material

2. Add pre-built material theme to be injected/bundled in project.config.ts.

    this.NPM_DEPENDENCIES = [
      ...this.NPM_DEPENDENCIES,
      /* Select a pre-built Material theme */
         {src: '@angular/material/prebuilt-themes/indigo-pink.css', inject: true}
    ];

3. Add Material configuration to SystemJS in project.config.ts.

   this.addPackageBundles({
     name:'@angular/material',
     path:'node_modules/@angular/material/bundles/material.umd.js',
     packageMeta:{
       defaultExtension: 'js'
     }
   });

Example usage of a Material Component

• Add import { MdToolbarModule } from '@angular/material'; in about.module.ts
• Add MdToolbarModule to NgModule imports in about.module.ts
• Add HTML element: <md-toolbar color="primary">My App</md-toolbar> in about.html
• Fix tests: add MaterialModule to imports of TestBed.configureTestingModule in about.component.spec.ts