Angular 2.0 中的模型驱动表单验证问题

Posted 2023-03-13

【中文标题】Angular 2.0 中的模型驱动表单验证问题

【英文标题】：Model driven form validation issue in Angular 2.0

【发布时间】：2017-09-17 00:10:49

【问题描述】：

在 Angular 2.0 中，我有使用 Form Builder 的模型驱动表单，

 ngOnInit() 
    this.user = this.fb.group(
        id: ['', [Validators.required, Validators.minLength(2)]],
        name: ['', [Validators.required, Validators.minLength(5)]]
    );
    
    this.user.get('id').valueChanges.subscribe(value => 
                alert("Change detected); 
                );

在 html 中我有：

<input   type="text" formControlName="id" >

但是发生的情况是，对于我在文本框中更改的每个字母，alert("Change detected"); 都会被解雇，而在制表符之后，我只需要调用 alert("Change detected")。我知道在 Angular 1.x 中可以通过使用 ng-model-options 来实现这一点，但如何在 Angular 2.0 中实现同样的效果？

【问题讨论】：

你在哪里写这个订阅？

在 ngOnInit() 中。编辑了问题

【参考方案1】：

您可以绑定到 onblur 处理程序

<input type="text" formControlName="id" (blur)="onBlur()">

在课堂上

onBlur()
  alert("Change detected");  

【讨论】：

我需要导入什么东西才能触发这个模糊事件吗？因为在进行此更改后，onBlur 函数根本不会触发。

它是在我身上触发的