时间戳

首页 > 解决方案 > 禁用时如何更改Angular 5材质中的样式 - 选择选定文本

css - 禁用时如何更改Angular 5材质中的样式 - 选择选定文本

问题描述

当设置为禁用时，如何更改显示来自 Angular 5 材料垫选择的选定值的文本上的字体颜色。目前它默认为灰色，我想更改它，以便在禁用和启用时都显示深蓝色。

  <mat-form-field>
    <mat-select placeholder="Select a Product" [(ngModel)]="selected" [disabled]="isDisabled" panelClass="my-select-panel-class">
      <mat-option *ngFor="let prod of products" [value]="prod.productID">
        {{ prod.key }}
      </mat-option>
    </mat-select>
  </mat-form-field>

标签： cssangularcolorsangular-material

解决方案

了解如何在禁用 mat-select 元素时更改字体颜色。上面的 ngClass 对字体颜色不起作用。它确实适用于字体大小。

The Styling mat-select in angular-material链接的答案最多，除了覆盖禁用字体颜色，您需要覆盖样式 .mat-select-value-text

例如

::ng-deep .mat-select-value-text {
  color: rgba(0,0,0,.88);
}

推荐阅读