Angular12表单验证器正在加载页面上进行验证

Question

我已经搜索了所有社区，但没有找到任何解决方案。

在有角度的步进器内部有一个形状。问题是当页面加载时，表单在启动时进行验证，使输入为红色，如下所示：

图像形式

我该如何防止这种情况发生？我已经试过和马克阿斯普里斯廷和其他人在一起了，但是，什么都没有。。。

这是初始化表单时的.TS部分(它是从ngOnInit调用的(：

this.professionalDataForm = this.formBuilder.group({
professionalRUT: this.formBuilder.control({value:'', disabled: false},[Validators.required]),
professionalName: this.formBuilder.control({value:'', disabled: false}),
address: this.formBuilder.control({value:'', disabled: false}),
commune: this.formBuilder.control({value:'', disabled: false}),
email: this.formBuilder.control({value:'', disabled: false})
});

这里是.html

<form [formGroup]="professionalDataForm">
<div class="row">
<mat-form-field class="col-md-4" appearance="outline">
<mat-label>Rut del profesional</mat-label>
<input matInput formControlName="professionalRUT" >
<mat-error class="line-broken-tooltip">
adsf
</mat-error> 
</mat-form-field>

thnks。。。

Answer 1

我不认为它是直接验证的，只是你需要控制何时应该显示mat-error。看看mat-form-field的示例，您的问题可以通过一个简单的ngIf来解决。

<mat-form-field class="col-md-4" appearance="outline">
<mat-label>Rut del profesional</mat-label>
<input matInput formControlName="professionalRUT" >
<mat-error class="line-broken-tooltip" *ngIf="professionalDataForm.controls?.professionalRUT?.invalid">
adsf
</mat-error> 
</mat-form-field>