環境：
Angular 4.0.0
Angular2 Material2 2.0.0-beta.3
node v7.4.0
npm 4.0.5
具體使用方法，查看官方教程：
https://material.angular.io
由于官方教程也是寫得相當迷，不怎么清晰的，所以就結合了這幾個教程一起看了：
https://github.com/angular/material2、https://www.npmjs.com/~angular2-material
它們的內容基本都相同的，但是排版上會比官方的好看多了... 主要還是要多看一下github的example，這樣會容易懂一點。
1.設置開發環境
首先需要安裝Node.js和npm。Mac的童鞋推薦使用安裝nvm對node和nvm進行版本管理。
然后全局安裝Angular-CLI
npm install -g @angular/cli
2.創建一個新的項目
ng new my-app
3.安裝 Angular Material components
進入項目目錄，然后安裝Angular Material 組件
cd my-app
npm install --save @angular/material
4.安裝Animation，并在app.module.ts導入
因為一些Angular Material組件是依賴于Angular animations模塊的。而Angular4.0開始就將Animation獨立出來使用，需要使用的時候需要另外安裝。
npm install --save @angular/animations
// imports
@NgModule({
...
imports: [BrowserAnimationsModule],
...
})
5.在app.module.ts 導入 Angular Material 模塊
1）統一將 Angular Material 所有模塊引入
import{ MaterialModule } from'@angular/material';
// other imports
@NgModule({
...
imports: [MaterialModule],
...
})
export class AppModule { }
2) 引入你需要使用的模塊
方法一
import {MdButtonModule, MdCheckboxModule} from '@angular/material';
@NgModule({
...
imports: [MdButtonModule, MdCheckboxModule],
...
})
方法二：創建單獨的NgModule模塊引入需要使用的模塊，方便你在任意地方使用組件
import {MdButtonModule, MdCheckboxModule} from '@angular/material';
@NgModule({
imports: [MdButtonModule, MdCheckboxModule],
exports: [MdButtonModule, MdCheckboxModule],
})
export class MyOwnCustomMaterialModule { }
6.在所需模塊中引入你所需要的模塊，編寫組件
比如Dialog。
import{MdDialog} from'@angular/material';
@Component({
...
})
export class DialogExample {
constructor(publicdialog: MdDialog) { }
openDialog() {
this.dialog.open(DialogOverviewExampleDialog);
}
}
具體的使用方法，麻煩查看文檔吧~
7.設置主題
1）使用自帶的主題
Angular Material自帶了幾款主題，具體位置在：
/Users/leechingyin/Sites/NgMaterial2Custom/ng-material-app/node_modules/@angular/material/core/theming/prebuilt
在style.css中，引入相應的主題，就可以使用該主題
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';
2）使用自定義主題
在scss文件中，引入主題文件，并對樣式進行設置
@import '~@angular/material/theming';
@include mat-core();
$primary: mat-palette($mat-cyan, 500);
$accent: mat-palette($mat-cyan, 400);
$warn: mat-palette($mat-cyan, 600);
$theme: mat-light-theme($primary, $accent, $warn);
@include angular-material-theme($theme);
如果你是使用Angular-CLI創建項目的話，則在項目中添加相應的scss文件，并在 "styles" list in angular-cli.json 添加入口文件，這樣就能使用到你自定義的主題文件了！
8.給你們設置主題教程的鏈接，并附帶幾個顏色工具，比較有用的
https://medium.com/covalent-ui/angular-material-2-theme-tutorial-2f7e6c344006
- Material Palette(web)— a simple web tool to quickly test a primary & accent color on an interface
- Material Colors(macOS) - macOS desktop app (React Nativeversion)
- Materialette(macOS/Windows/Linux)?—?toolbar app with hex/rgb
- MaterialUI(web)?—?hex/rgb/rgba web palette selection
- MaterialUIColors(web)?—?another web hex/rgb/rgba selection
