在Angular Reactive Forms中的FormGroup实例上设置错误不能按预期方式工作

Question

我正在使用Angular 4.4.3反应窗体来实现窗体中一组控件的自定义验证。方法AbstractControl.setErrors根据文档更新AbstractControl的错误属性，在其上调用它，更新其父项的状态，但不更新父项错误属性。我想在FormGroup实例上设置errors属性，所以我使用FormGroup继承的setErrors。但是，它不会按预期更新错误。

下面是我的示例代码： 尝试它FormControl情况下，不更新自己的错误，以及他们父母的有效性状态（不是父母的错误，但！）：

let myFormGroup 
    = this._formBuilder 
      .group({ 
        ctrl1: [null], 
        ctrl2: [null] 
       }, 
       { 
        validator: (fg: FormGroup) => { 
            let ctrl1 = fg.get('ctrl1'), 
             ctrl2 = fg.get('ctrl2'), 
             ctrl1Empty = !ctrl1.value, 
             ctrl2Empty = !ctrl2.value; 

             //Successfully sets ctrl1.errors and fg.status, but not fg.errors 
             if (ctrl1empty) 
             ctrl1.setErrors({ctrl1required: true}); 
             //Successfully sets ctrl2.errors and fg.status, but not fg.errors 
             if (ctrl2Empty) 
             ctrl2.setErrors({ctrl2required: true}); 
             //Doesn't work, doesn't update fg.errors 
             if (ctrl1Empty && ctrl2Empty) 
             fg.setErrors({required: true}); 
           } 
       }) 

任何想法，为什么？

Answer 1

所以，感谢@ incognito的确认，我在进一步检查后发现问题出在哪里。

setErrors，设置表单组实例的errors属性。但是，我的问题中显示的自定义验证器没有显式返回一个值（即错误的未定义值）。在angular角度查看反应形式模块的代码，我发现this method，它合并了由this line中的各种验证器引发的错误，该方法检查错误（未在我的代码片段中定义）是否不等于null。这种情况（在es5版本中检查过）评估为false，导致结果为空，从而忽略代码中设置的错误属性的内容。我学到的教训是：即使进一步嵌套的FormGroup实例具有自己的用于设置错误的自定义逻辑，也总是从自定义验证器返回一个值。