Можно ли сделать всю границу поля формы входного мата красной при ошибке проверки

В моей форме у меня есть поле электронной почты, которое настраивается, и я не могу использовать поле ввода внешнего вида.

      <mat-form-field appearance="fill">
    <mat-label>Enter your email</mat-label>
    <input matInput placeholder="pat@example.com" [formControl]="email" required>
    <mat-error *ngIf="email.invalid">{{getErrorMessage()}}</mat-error>
  </mat-form-field>

При проверке, если есть ошибка, она появляется, как показано ниже

Можно ли сделать так, чтобы он выглядел, как показано ниже, с выделением всего поля ввода

Я мог видеть много примеров для поля формы внешнего вида контура, но не для внешнего вида заливки. Может кто-нибудь направит. TIA

1 ответ

Решение
      ::ng-deep .mat-form-field-invalid .mat-form-field-flex {
  border: 2px solid red !important;
  border-bottom: none;
}

Вам нужно использовать ::ng-deepчтобы получить желаемый результат. Демо-ссылка . Сообщите мне, если возникнут какие-либо проблемы.

Другие вопросы по тегам