Angular 材质样式已完成的步骤答案

【问题标题】：Angular Material Style Completed StepsAngular 材质样式已完成的步骤
【发布时间】：2017-11-20 16:04:51
【问题描述】：

有没有办法在 Angular Materials 步进模块中设置已完成步骤的图标样式？当我完成一个步骤时，它会将图标调整为复选标记。我也在尝试调整图标的背景颜色。我的代码与此处启用线性模式的示例类似：https://material.angular.io/components/stepper/overview

当我查看 DOM 时，唯一在完成时更改的属性是“ng-reflect-ng-switch”属性。我不确定如何定位这个元素以便在完成后对其进行样式设置。希望有人能指出我正确的方向。谢谢！

【问题讨论】：

标签： css angular typescript angular-material angular-material-stepper

【解决方案1】：

我通过像这样定位元素属性来完成这项工作：

[ng-reflect-ng-switch~="done"] {
  background-color: green;
}

【讨论】：

使用 ng-reflect 属性来设置样式是个坏主意，因为它们用于调试目的，在生产环境中不可用。