javascript - angular 5, reactive form-重置所需的表单控件不会重置输入下所需的错误

Question

在模板中，我有一个通过按下按钮打开的表单-

     <form [formGroup]="person"
          (ngSubmit)="onSubmitNewPerson()"
          #formDirective="ngForm">

            <mat-form-field>
                <input matInput formControlName="firstName" required>
            </mat-form-field>

            <mat-form-field>
                <input matInput formControlName="lastName" #last required>
            </mat-form-field>
</form>

在组件中我有这段代码-

  @ViewChild('formDirective') formDirective: FormGroupDirective;

 this.person = this.formBuilder.group({
            lastName: ['', Validators.required],
            firstName: ['', Validators.required]
        });

关闭按钮后我运行这个函数-

   this.formDirective.resetForm();//hack that I saw in some question
    this.person.reset();

但在再次打开表单后，我立即看到输入下方的红色错误。

我也试过这个-

    this.person.get('firstName').markAsUntouched();
   this.person.get('lastName').markAsUntouched();
     this.person.get('firstName').markAsPristine();
    this.person.get('lastName').markAsPristine();

但这也行不通。

知道如何解决吗？

Answer 1

当我想重置验证器时，我使用了以下一次:

    this.person.get('firstName').clearValidators();
    this.person.get('firstName').updateValueAndValidity();