如何更改占位符顏色<input>它在里面<mat-form-field>從角材料？

Question

我正在嘗試使用 .CSS 將輸入元素上的占位符顏色更改為白色。 它在里面的元素

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

Answer 1

Angular Material 組件顏色依賴於主題。 這意味着您可以創建自定義主題來完成這項工作。 如果有幫助，請查看如何創建主題： https : //material.angular.io/guide/theming

另一個解決方案可能是覆蓋 css 樣式，但我目前確實掌握了輸入組件內占位符的知識

Answer 2

主題化是為材質組件着色的正確方法，但是，如果您想手動覆蓋材質輸入中的標簽，您可以這樣做：

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

https://stack59148369.stackblitz.io