角6反应形式FormGroup验证

Question

尝试根据某些条件添加验证器。条件为真时，我将添加所需的验证器，并在条件为假时将其删除。

    createReactiveForm(data: any) {
    const formGroup = new FormGroup({
        'control1': new FormControl(data.key1),
        'control2': new FormControl(data.key2)
    }, this.formValidators.bind(this)),
}


formValidators(formGroup: FormGroup){
    const control1Val: boolean = formGroup.controls['control1'].value;
    if (control1Val) {
        const control2: AbstractControl = formGroup.controls['control2'];
        constrol2.setValidators(Validators.required);
    } else {
        const control2: AbstractControl = formGroup.controls['control2'];
        constrol2.setValidators(() => null);
    }
}

1. formValidators（）方法被称为无限次-我在这里是否做错了什么？

2. 当条件为true时，它将添加验证器并显示错误;但是当条件为false时，将删除验证器，但控件上的错误仍然存​​在-原因是什么？

3. 将formValidators（）方法绑定到formGroup中是一种好方法吗？

请帮助我。

Answer 1

1. 否，它在每个更改检测周期/控制更改上都被调用。
2. 致电control.setErrors(null)。
3. 第二个参数需要一个功能。您的代码没有问题。

验证器函数应返回错误对象或空。我不建议将您的逻辑放在验证器函数中，因为它不合适。您可以收听control1 valueChanges并将逻辑移到那里。这样，您将优化代码，使其仅在control1值更改时才能运行。