Угловые формы показывают ошибки, когда нетронутые

Question

Рассмотрим угловую форму внутри компонента с полностью управляемыми ошибками и элементами управления. Эта форма используется для добавления и редактирования * определенных значений в конкретном сценарии.

<form #addConfigurationFormRef="ngForm"
              (ngSubmit)="onFormSubmit(addConfigurationFormRef)">
          <mat-form-field>
            <input matInput
                   ngModel
                   [(ngModel)]="configuration.signatory"
                   name="signatory"
                   placeholder="Certificate Signatory"
                   autocomplete="off"
                   required
                   maxlength="100"
                   minlength="3" />
          </mat-form-field>
         <mat-card-actions
            <button mat-raised-button
                    color="accent"
                    [disabled]="addConfigurationFormRef.invalid || pageSubmit">
              {{ formActionButtonLabel }}
            </button>
        </mat-card-actions>
</form>

Обратите внимание, что выполняется операция редактирования, данные уже представлены в базе данных.

public formActionButtonLabel: string = "Add Configurations";
public isEditComponent: Boolean = false;
public onFormSubmit(form: NgForm): void{ //logic };
public configuration: CfConfiguration = {};

ngOnInit() {
  this.fetchCommonDataService.data$.subscribe(data =>{
    if(data) this.isEditComponent = true; 
    if(data) this.configuration = data;

  });
}

Проблема: Во время операции редактирования форма заполняется привязкой данных. Теперь учтите, что некоторые поля теперь недействительны, они не выделяются красным, поскольку форма все еще остается нетронутой.

Требование: Я хочу, чтобы как только существующие данные помещались в форму, недопустимое поле было выделено.

Использование Угловой 7 и Материал CDK

Answer 1

Может быть, вы могли бы активировать грязное состояние ввода программно, если оно находится в режиме редактирования. Чтобы установить грязные входные данные формы, вы можете использовать control.markAsDirty();, как указано в: 37844092