Угловая 6 реактивная форма проверки формы FormGroup
Попытка добавить валидатор в зависимости от некоторых условий. Когда условие истинно, я добавляю требуемый валидатор и удаляю его, когда оно ложно.
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);
}
}
Метод formValidators() вызывается бесконечное количество раз - делаю ли я здесь что-то не так?
Когда условие истинно, оно добавляет валидаторы и отображает ошибку. Но когда условие ложно, валидаторы удаляются, но ошибка в элементе управления все еще существует - в чем причина?
Это хороший подход, чтобы связать метод formValidators() в formGroup?
Помоги мне в этом.
1 ответ
- Нет, он вызывается при каждом обнаружении изменений / изменении управления.
- Вызов
control.setErrors(null)
, - Второй параметр ожидает функцию. Там нет проблем с вашим кодом.
Функция Validator должна возвращать объект ошибки или ноль. Я не рекомендую помещать вашу логику в функцию валидатора, так как это не то место. Вы можете прослушать контроль1 valueChanges
и переместить логику туда. Таким образом, вы оптимизируете код для запуска только при изменении значения control1.