Как я могу настроить поле формы мат в отключенном состоянии

Question

Я пытаюсь настроить поле формы углового материала: я смог настроить границу подчеркивания, используя:

::ng-deep.mat-form-field-ripple {
  background-color: yellow;
}

, сейчас я пытаюсь настроить границу подчеркивания в отключенном состоянии, чтобыбыть твердым вместо пунктирной линии:

Я пробовал это, но это не сработало для подчеркивания:

::ng-deep.mat-form-field-disabled
 {

 }

Я хочу, чтобы это было серым цветом в отключенном состоянии

 <mat-form-field>
    <input matInput placeholder="Input" [disabled]='true'>
  </mat-form-field>

Answer 1

Это исправлено:

    ::ng-deep.mat-form-field-disabled .mat-form-field-underline {
    background-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 1) 0,
    rgba(0, 0, 0, 0.42) 33%,
    #c2c7cc 0
  ) !important;
  background-size: 1px 100% !important;
  background-repeat: repeat-x !important;
}

Answer 2

Это исправлено:

 ::ng-deep.mat-form-field-disabled .mat-form-field-underline 
    { 
    background-image: linear-gradient( to right, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 0.42) 33%, #c2c7cc 0 ) !important; 
    background-size: 1px 100% !important;
     background-repeat: repeat-x !important; 
    } 

Answer 3

Вам необходимо выбрать следующий класс: -

.mat-form-field-disabled .mat-form-field-underline

CSS, который вы хотите изменить: -

background-image: linear-gradient(to right,rgba(0,0,0,1) 0,rgba(0,0,0,.42) 33%,transparent 0);
background-size: 4px 100%;
background-repeat: repeat-x;

Таким образом, вы можетелибо unset: all и начните с нуля, либо обновите background-size: 1px 100%; или все, что соответствует вашим потребностям