Angular Material 2.0.0-beta.1组件无法正确呈现

Question

我只是检查角度材料2，并且我的应用程序中没有任何组件正常工作。角度材质2的版本为2.0.0-beta.1。

我只是关注了角度素材2 github存储库中提供的getting started guide。

这是我的html模板，

<md-card>
  <button md-button>FLAT</button>
  <button md-raised-button md-tooltip="This is a tooltip!">RAISED</button>
  <button md-raised-button color="primary">PRIMARY RAISED</button>
  <button md-raised-button color="accent">ACCENT RAISED</button>
</md-card>

<md-card>
  <md-checkbox>Unchecked</md-checkbox>
  <md-checkbox [checked]="true">Checked</md-checkbox>
  <md-checkbox [indeterminate]="true">Indeterminate</md-checkbox>
  <md-checkbox [disabled]="true">Disabled</md-checkbox>
</md-card>

<md-card>
  <md-radio-button name="symbol">Alpha</md-radio-button>
  <md-radio-button name="symbol">Beta</md-radio-button>
  <md-radio-button name="symbol" disabled>Gamma</md-radio-button>
</md-card>

在浏览器中以这样的方式呈现。

我在这里一无所知。我需要帮助才能找出问题所在。

Answer 1

您应始终将主题应用于素材：

您可以从@angular/material/core/theming/prebuilt

直接将主题文件包含到您的应用程序中

您只需在样式中添加导入css/scss：

例如：

@import '~@angular/material/core/theming/prebuilt/deeppurple-amber.css';

您还可以定义自定义主题。有关更多信息，请阅读主题自述文件：

custom material theming