Question

我在Angular Material中使用反应形式。当我单击onsubmit（）时，我希望所有没有值的参数都不会显示错误（红线）

我尝试使用this.formGroup.markAsUntouched();，但是没有用。

当我不使用Angular Material时，它可以工作。有人知道如何正确使用Angular Material吗？

<form [formGroup]="formGroup" (ngSubmit)="onSubmit(formGroup.value)" class="form">
    <mat-form-field class="form-element">
        <input matInput placeholder="Emailaddress" formControlName="email">
    </mat-form-field>
</form>



onSubmit(post) {
    this.formGroup.markAsUntouched();
}

formGroup将保持不变，但红线仍会出现。

Answer 1

formReset(formGroup: FormGroup) {
    formGroup.control.reset();
    formGroup.control.markAsPristine();
    formGroup.control.markAsUntouched();
}

// for safety measure try calling this function in a try-catch block, it works on a reactive forms

Answer 2

您可以尝试使用类似这样的方式在表单上进行书写。

onSubmit(post) {
    Object.keys(this.formGroup.controls).forEach(control => {
        if (!this.imeiForm.controls[control].value.length)
        {
            this.imeiForm.controls[control].markAsUntouched()
        }
    });
}

我认为只要值的长度为0（如果未输入任何内容），它将循环访问每个控件并将其标记为未触动。据我所知，应该使用markAsUntouched()来引用控件而不是整个表单组。只要红线是他们听的感动属性，它就应该起作用。

您可以使用.reset（）重置整个表单

this.formGroup.reset();

这会将所有值恢复为原来的值，但是抱歉，没有消除红线。

BR。

Answer 3

如果出现红色下划线，则可以重置所有FormGroup错误 this.formGroup.setErrors(null);

Answer 4

使用这种方法禁止显示所有错误消息

Insert

或者单独隐藏任何消息

Object.keys(this.mygroup.controls).map((field) => {
      const control = this.mygroup.get(field);
      if (control instanceof FormControl) {
        control.setErrors(null);
      }  
    });

markAsUntouched不能清除红线

4 个答案: