angular - 在 Angular Material 中添加自定义颜色变量 (2+)

Question

如何为 angular material 创建“自定义”自己的颜色？

例如，bootstrap 喜欢success(绿色)、warn(黄色)、danger(红色)、 旁边的颜色primary(蓝色)，accent(粉红色)。

换句话说:扩展 Angular Material (2+) 的颜色变量，以便在 html 属性中使用它:

<button mat-raised-button color="success">Success</button>

或创建一个白色复选框，如:

<mat-checkbox color="white">Check me!</mat-checkbox>

Answer 1

你做不到。但是，如果您愿意，可以将“color="whatever"属性添加到 Material 的某些元素，这会为您添加自定义类。

例子:

.whatever {
  background-color: light-blue;
}

<button mat-button color="whatever"></button> // this button will have '.mat-whatever' class.