在 Angular 中清除验证错误消息答案

【问题标题】：Clear Validations error message in Angular在 Angular 中清除验证错误消息
【发布时间】：2022-01-16 14:37:23
【问题描述】：

我有一个打字稿：

dataxForm: fromGroup
this.dataxForm = new FormGroup({
'Description':new FormControl(null, Validaros.required};
'Name':new FormControl(null, Validators.required})

我有一个html：

<mat-divider></mat-divider>
<form [formGroup]="dataxForm">
<ng-template #editDescription>
<input formControlName = "Description item">
<textarea matInput cdsTextareaAutosize [formControl]="controls.description"></textarea>
<small class="text-danger"  *ngIf=dataxForm.get('Description').invalid || dataxForm.get('Description').touched"> Description is a required field></small>

<mat-divider></mat-divider>
<form [formGroup]="dataxForm">
<ng-template #editDescription>
<input formControlName = "Name">
<textarea matInput cdsTextareaAutosize [formControl]="controls.description"></textarea>
<small class="text-danger"  *ngIf=dataxForm.get('Name').invalid || dataxForm.get('Name').touched"> Name is a required field></small>


<button mat-button [disabled] = "dataxForm.invalid (click)="submitForm">Submit Form</button>

一旦我加载页面，验证错误消息就会正确显示；在输入下盒子； 1) 如何验证要求后立即删除输入下的错误消息清除？ 2）如何在所有验证时解冻提交按钮需求清除了吗？

【问题讨论】：

标签： angular typescript validation formgroups

【解决方案1】：

dataxForm.get('Description') 和 dataxForm.get('Name') 在组件渲染时无效。

试试这个：

<small class="text-danger"  *ngIf="(dataxForm.get('Description').touched || dataxForm.get('Description').dirty) && dataxForm.get('Description').invalid"> Description is a required field></small>

【讨论】：

谢谢；一旦我开始在输入框中输入，这并不会删除验证错误消息；你知道吗？
@uniXVanXcel 我不知道错误是否发生，因为您的 .html 中的 typos 太多。首先，在正常情况下，.html 中只会定义一个同名的 formGroup。第二，也许是formControlName="Description" 而不是formControlName = "Description item"。顺便说一句，在 HTML 中，属性和属性之间允许有空格，但是当将值分配给属性或属性时，它们之间最好不要有空格。
按钮解冻问题 => [disabled]="dataxForm.invalid? true : false" 也许对你来说是一个更好的答案