首先

我粗略总结了在Angular 5中安装Angular Material的步骤，按照官方指南进行整理，但剪掉了似乎不必要的部分。此次验证是在Angular CLI 1.5.0进行的。

引用Angular Material

项目创建

使用Angular CLI创建项目
切换到创建的项目文件夹中

ng new sample-app
cd sample-app

请使用npm来安装库。

npm install --save @angular/material @angular/cdk hammerjs

导入模块

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatButtonModule, MatCardModule, MatInputModule, MatToolbarModule } from '@angular/material';

  @NgModule({
  ...
    imports: [
      ...
      BrowserAnimationsModule,
      MatButtonModule,
      MatCardModule,
      MatInputModule,
      MatToolbarModule,
     ...

    ],

注意：选择要在Angular Material中使用的每个模块。还有很多其他模块，如MatCheckboxModule、MatRadioModule等。

CSS主题设置

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

主题文件默认情况下存在以下内容，您可以根据喜好选择。

• deeppurple-amber.css

• indigo-pink.css

• pink-bluegrey.css

purple-green.css

导入 hammerjs

import 'hammerjs';

使得可以使用图标。

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

只有在需要时才需要图标，这样就可以了。
但为什么只有这里需要直接引用网络上的图标呢？

无论如何，到这一步安装已经完成。