Angular 反应式表单输入验证无法在负载上运行

Question

我对反应式表单验证有点陌生，试图在页面加载时实现输入验证，我有一个简单的输入字段，我需要在页面加载时验证，而不是手动验证。要求是我有一堆输入字段的编辑表单，我正在寻找每个字段的 maxLength 验证。我在 patchValue/setValue 上尝试使用 updateValueAndValidity，但错误不会出现，非常感谢任何帮助。

注意：我需要在页面加载时显示错误

Stackblitz

Answer 1

您的 StackBlitz 示例几乎是正确的。在表单中设置数据后，您不需要调用任何额外的方法，例如 .updateValueAndValidity()，您只是在错误地检查错误状态：

<span *ngIf="sampleForm.get('inputTxt').hasError(maxLength)">
  Max(10) letters reached!!!
</span>

应该是：

<span *ngIf="sampleForm.get('inputTxt').hasError('maxlength')">
  Max(10) letters reached!!!
</span>

有关工作示例，请参阅此更新的 StackBlitz：https://stackblitz.com/edit/angular-2fvyqj

Angular 反应式表单输入验证无法在负载上运行

Angular reactive forms input validation not working on load

angular

angular-reactive-forms