Angular: 添加到现有的验证器集 Formcontrol

Question

如何在 FormControl 上添加或推送到现有的一组验证器？我想添加为数组。以下答案只会一次设置它们。

newFormControl.setValidators([Validators.required])
newFormControl.setValidators([Validators.pattern("^[0-9]*$")])
newFormControl.setValidators([Validators.maxLength])

Answer 1

setValidators() 删除了以前的验证器，因此您可能希望单独收集验证器，例如将它们保存在两个变量中，并根据需要用一个 setValidators() 设置它们。


    const validators1 = [Validators.required, Validators.pattern("^[0-9]*$"), Validators.maxLength(10)])]
    const validators2 = [Validators.required]

    if( if_you_want_all_three_validators ){
        newFormControl.setValidators(validators1)
    } else {
        // by default you want only one validator:
        newFormControl.setValidators(validators2)
    }

这样就不用一一设置了

（由于验证器未存储在 setValidators() 内部的数组中，因此您必须一次调用将所有验证器发送到 setValidators。）

Answer 2

您可以使用 new Array<ValidatorFn>(); 设置一个数组，并在下面单独推送验证器。

let validatorList = new Array<ValidatorFn>();
validatorList.push(Validators.required);
validatorList.push(Validators.pattern("^[0-9]*$"));
validatorList.push(Validators.maxLength(item.characterLimit));
newForm.addControl('test', new FormControl(d'5', validatorList));

Angular: 添加到现有的验证器集 Formcontrol

Angular: Add to Existing Set of Validators Formcontrol

typescript

angular

angular-reactive-forms

angular10