Angular Как добавить Validator в FormControl после того, как элемент управления создан?

У нас есть компонент, который имеет динамически построенную форму. Код для добавления элемента управления с помощью валидаторов может выглядеть следующим образом:

var c = new FormControl('', Validators.required);

Но скажем, что я хочу добавить 2-й валидатор позже. Как мы можем это сделать? Мы не можем найти документацию в этом онлайн-режиме. Я нашел, хотя в элементах формы есть setValidators

this.form.controls["firstName"].setValidators

но неясно, как добавить новый или настраиваемый валидатор.

Спасибо, куча.

Ответ 1

Вы просто передаете FormControl массив валидаторов.

Вот пример, показывающий, как вы можете добавить валидаторы в существующий FormControl:

this.form.controls["firstName"].setValidators([Validators.minLength(1), Validators.maxLength(30)]);

Обратите внимание: это будет reset любые существующие валидаторы, которые вы добавили при создании FormControl.

Ответ 2

Чтобы добавить то, что отправил @Delosdos.

Установите валидатор для элемента управления в FormGroup: this.myForm.controls['controlName'].setValidators([Validators.required])

Удалить валидатор из элемента управления в FormGroup: this.myForm.controls['controlName'].clearValidators()

Обновить группу FormGroup после запуска любой из указанных строк. this.myForm.controls['controlName'].updateValueAndValidity()

Это потрясающий способ программной настройки проверки формы.

Ответ 3

Если вы используете responsetiveFormModule и форма formGroup определена следующим образом:

public exampleForm = new FormGroup({
        name: new FormControl('Test name', [Validators.required, Validators.minLength(3)]),
        email: new FormControl('[email protected]', [Validators.required, Validators.maxLength(50)]),
        age: new FormControl(45, [Validators.min(18), Validators.max(65)])
});

чем вы можете добавить новый валидатор (и сохранить старые) в FormControl с этим подходом:

this.exampleForm.get('age').setValidators([
        Validators.pattern('^[0-9]*$'),
        this.exampleForm.get('age').validator
]);
this.exampleForm.get('email').setValidators([
        Validators.email,
        this.exampleForm.get('email').validator
]);

FormControl.validator возвращает составной валидатор, содержащий все ранее определенные валидаторы.

Ответ 4

Я думаю, что выбранный ответ не является правильным, так как оригинальный вопрос "как добавить новый валидатор после создания formControl".

Насколько я знаю, это невозможно. Единственное, что вы можете сделать, это динамически создать массив валидаторов.

Но что нам не хватает, так это функции addValidator(), которая не переопределяет валидаторы, уже добавленные в formControl.

Если у кого-то есть ответ на это требование, было бы неплохо опубликовать здесь.

Спасибо