Угловая 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);
    }
}
  1. Метод formValidators() вызывается бесконечное количество раз - делаю ли я здесь что-то не так?

  2. Когда условие истинно, оно добавляет валидаторы и отображает ошибку. Но когда условие ложно, валидаторы удаляются, но ошибка в элементе управления все еще существует - в чем причина?

  3. Это хороший подход, чтобы связать метод formValidators() в formGroup?

Помоги мне в этом.

1 ответ

  1. Нет, он вызывается при каждом обнаружении изменений / изменении управления.
  2. Вызов control.setErrors(null),
  3. Второй параметр ожидает функцию. Там нет проблем с вашим кодом.

Функция Validator должна возвращать объект ошибки или ноль. Я не рекомендую помещать вашу логику в функцию валидатора, так как это не то место. Вы можете прослушать контроль1 valueChanges и переместить логику туда. Таким образом, вы оптимизируете код для запуска только при изменении значения control1.

Другие вопросы по тегам