如何在Angular2中的css中使用材质主题颜色？

Question

我们说我需要使用mat-primary颜色作为使用css / sass类的div的背景，我该如何引用它？我想的是：

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

.a-class{
  background-color: $mat-primary;
}

但悲惨地失败了。

Answer 1

您必须先使用

导入主题

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

然后你必须定义一个mixin，如

@mixin primary-color($theme) {

  $primary: map-get($theme, primary);

  //Then you can use `mat-color` to get the `primary` color
  .a-class {
    background-color: mat-color($primary);
  }
}

^{参考链接：Documentation}