angular - Angular Material2 工具栏响应地改变颜色

Question

是否可以响应地改变md-toolbar颜色？

我用 Flex-Layout 包响应 API 做了这样的事情：

md-toolbar color.xs="primary"

它没有用。

我猜我可以通过观察ObservableMedia然后在代码中设置工具栏的颜色来改变它，但我想知道是否有更简单的方法。

谢谢

更新

我已经打开了一个问题，作为功能请求，基本上是按照我上面所说的。他们说没有计划。

Answer 1

当然，但你需要通过一些 css ：

@import '~@angular/material/theming';
@import 'src/assets/css/theming.scss';

.primary { background: mat-color($primary); }
.accent { background: mat-color($accent); }
.warn { background: mat-color($warn); }

（假设您的主题文件放置正确并且您使用了正确的变量名）

现在在您的工具栏中：

<md-toolbar ngClass.xs="primary" ngClass.md="accent"></md-toolbar>