css - 使用 Angular 7+ 和 Angular Material 更改占位符颜色？

Question

我希望使用 Angular 7+ 和 Angular Material 更改输入字段上占位符文本的颜色。

查看我尝试使用::ng-deep 和 mat-placeholder 的类似问题。我使用 mat-placeholder 让它工作，但是这将在 Angular Material 的 future 版本中被删除。

<form class="example-form">
  <mat-form-field class="example-full-width">
    <input matInput placeholder="Favorite food" value="Sushi">
  </mat-form-field>
</form>

更改 matInput 占位符文本的颜色。

Answer 1

<mat-form-field>
<input matInput type="text">
<mat-placeholder class="placeholder">Email</mat-placeholder>
</mat-form-field>

    .mat-form-field-underline {
    /*change color of underline*/
    background-color: #dce2f4 !important;
    } 

    .mat-form-field-ripple {
    /*change color of underline when focused*/
    background-color: #2e2f36 !important;
    } 
    .placeholder {
      color:  #dce2f4 ;

    }