在 FormArray 上为 required 和 minlength 设置 formvalidator

Question

我想在 formArray 元素上设置一个最小长度验证器。

这是我创建表单的方式。

this.fb.group({
            FieldName: ['', [Validators.required, Validators.pattern(/^\S*/)]],
            Treatment: '',
            Properties: this.fb.group(
                {
                    contentType: this.fb.array([]),
                    multipleItems: false,
                    keyType: this.fb.group({
                        'Type': '',
                        'Prefix': '',
                        'Suffix': ''
                    }),
                }
            )
        });

这是我正在尝试的代码。它没有得到应用，并且表单完全忽略了这一点并变得有效。

this.fieldForm.get('Properties.contentType').setValidators([Validators.required, Validators.minLength(1)]);

Answer 1

您必须在设置新验证器后调用 updateValueAndValidity()

this.fieldForm.get('Properties.contentType').setValidators([Validators.required, Validators.minLength(1)]);
this.fieldForm.get('Properties.contentType').updateValueAndValidity();

另请注意，它必须是 this.fieldForm.get('Properties').get('contentType').setValidators([Validators.required, Validators.minLength(1)]);

因为您有 Properties 控件的子表单组。

Answer 2

Set FormGroup 中控件的验证器：this.myForm.controls['controlName'].setValidators([Validators.required])

Remove 来自 FormGroup 控件的验证器：this.myForm.controls['controlName'].clearValidators()

Update FormGroup 一旦你有运行以上任何一行。 this.myForm.controls['controlName'].updateValueAndValidity()

所以上下文

    this.fieldForm.controls['Properties.contentType'].setValidators([Validators.required, Validators.minLength(1)]);
    this.fieldForm.controls['Properties.contentType'].updateValueAndValidity()

在 FormArray 上为 required 和 minlength 设置 formvalidator

Set formvalidator on FormArray for required and minlength

angular

angular-reactive-forms