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

Question

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

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

Image Form

我怎样才能防止这种情况发生呢？我已经和markAsPristine和其他人试过了，但是，什么都没有..。

这是初始化表单时的.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应该何时显示或不显示。看看the example for the ，你的问题可以通过一个简单的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>