如何从角度材料中更改 <mat-form-field> 内的 <input> 占位符颜色？答案

【问题标题】：How do I change the placeholder color of <input> that it is inside <mat-form-field> from angular material?如何从角度材料中更改 <mat-form-field> 内的 <input> 占位符颜色？
【发布时间】：2019-12-02 23:56:45
【问题描述】：

我正在尝试使用 .CSS 在我的输入元素上将占位符颜色更改为白色。元素在里面

  <mat-form-field class="text-center">
    <input class="daniel" matInput (keyup)="applyFilter($event.target.value)" placeholder="Search-bar">
  </mat-form-field>

【问题讨论】：

你试过什么？一个 stackblitz 的例子怎么样？

标签： angular angular-material mat-form-field

【解决方案1】：

Angular Material 组件的颜色依赖于主题。这意味着您可以创建自定义主题来完成这项工作。如果有帮助，请查看如何创建主题： https://material.angular.io/guide/theming

另一种解决方案可能是覆盖 css 样式，但我目前确实掌握了输入组件内占位符的知识

【讨论】：

【解决方案2】：

主题是为材质组件着色的正确方法，但是，如果您想手动覆盖材质输入中的标签，您可以这样做：

::ng-deep .mat-form-field.mat-focused .mat-form-field-label {
    color:white;
}

https://stack59148369.stackblitz.io

【讨论】：