Angular Mat-form-field占位符颜色

Question

我有一个在mat-form-field中有输入的表格。它包含占位符，但我不知道如何设置占位符文本颜色。

当我之前未集中输入时，占位符颜色为灰色：

当输入聚焦时，它变成紫色：

当输入失去焦点时，它变成红色：

我的要求是更换紫色的。我已经尝试过以下解决方案：https://css-tricks.com/almanac/selectors/p/placeholder/但这对我不起作用。

任何想法？

提前感谢！

Answer 1

在style.scss文件中，放置以下样式

.mat-input-placeholder {
    color: purple;
}

请注意，这会在所有位置覆盖Angular Material的默认样式。如果您只想在组件内部应用此功能，请尝试如下所示

:host::ng-deep .mat-input-placeholder { 
  color: red; 
}