Как изменить цвет заполнителя mat-select? - PullRequest
0 голосов
/ 22 ноября 2018

Я пытаюсь изменить цвет метки-заполнителя.Это хорошо работает, если это 'background-color', но не если это 'color'.Вот мой код CSS:

/deep/ .mat-select-placeholder {
  color: red;
 }

 .mat-select-placeholder {
   color: red;
 }

Вот код hmtl:

<mat-form-field class="formfield-size-medium">
  <mat-select [formControlName]="formControl.nationality" name="Nationality"
          placeholder="Nationalities" 
      class="class-mat-select" multiple>
          <mat-option *ngFor="let nationality of 
             nationalityList.nationalities" [value]="nationality.value">
              {{getNationalityValue(nationality.value)}}
          </mat-option>
  </mat-select>
</mat-form-field>

Я пробовал также с / deep /, но он все еще не работает.Текст всегда черный.Так почему же он работает с background-color, а не с color?Моя другая проблема заключается в том, что, когда в списке выбрана опция mat, заполнитель (выглядит меньше) всегда будет черным, даже если цвет установлен на красный, а background-color также установлен на красный.Спасибо за вашу помощь.

1 Ответ

0 голосов
/ 23 ноября 2018

Мне удалось изменить цвет заполнителя следующим образом

style.css

mat-form-field span.mat-form-field-label-wrapper label {
  color:orange !important;
}

mat-form-field.mat-focused span.mat-form-field-label-wrapper label {
  color:green !important;
}

демонстрация stackblitz

...