Question

我有一个反应性形式验证者样品。在输入值之前，它最初会显示验证错误消息。

预期的行为是，输入值后必须显示错误消息

Answer 1

您必须检查是否触摸了这样的错误消息

 <div *ngIf="check.errors.required && check.touched" class="e-error">
                This field is required.
 </div>

您正在检查是否需要，因此在加载表单时，您的字段显然为空，因此将引发错误。

您将在此处获得更多信息和示例：Built In Validators和Reactive Form Validattions

Answer 2

创建表单服务并使用将FormGroup标记为已触摸，以便默认情况下不会显示错误消息

import { FormService } from './services/form';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.scss' ]
})

export class AppComponent  {
 public testForm: FormGroup;

ngOnInIt(){
 this.testForm.valueChanges.subscribe((data) => {
    this.FormService.markFormGroupTouched(this.testForm);
})
}
}

角反应形式验证器最初显示错误消息？

2 个答案: