Angular2-Material更改错误的md输入样式

Question

如果我的表单出现错误，我会更改输入的标签以及下面的文本颜色和边框颜色，就像使用dividerColor一样，但是没有焦点，我会喜欢这种持久性。

所以我在那里为标签制作了这段代码：

md-input:not(.ng-valid) label { background-color: red !important; color:red !important; }

但是，当我运行项目时，我的css会以这种方式修改：

md-input[_ngcontent-fcu-13]:not(.ng-valid) label[_ngcontent-fcu-13] { background-color: red !important; color:red !important; } 

因此，它不起作用。 你有好主意吗 ？ （通过谷歌翻译翻译）

Answer 1

您是否尝试在您描述它的组件树之外使用此样式？ 像_ngcontent-fcu-13 angular这样的属性添加到DOM元素和样式来实现View Encapsulation。因此，如果您将样式作为组件元数据的一部分导入，则会将此类属性添加到所有样式。

您应该将全局样式移动到app.component或将它们直接注入index.html。

您也可以通过添加

关闭View Encapsulation

encapsulation: ViewEncapsulation.None

进入组件的元数据

看看这个article。它帮助了我很多。