Блог

Я читал кулинарную книгу Angular 2 по динамическим формам, используя модуль реактивных форм (https://angular.io/docs/ts/latest/cookbook/dynamic-form.html )

Я заметил, что они определяют, как динамически создавать элементы управления формами, такие как :

     questions.forEach(question => {
  group[question.key] = question.required ? new FormControl(question.value || '', Validators.required)
                                          : new FormControl(question.value || '');
});
  

Для начала это кажется замечательным, но каков наилучший подход для этого, если у вас есть несколько или пользовательские валидаторы? Например, если бы у меня был существующий элемент управления формой, который был определен как

 this.myForm= this.formBuilder.group({
        inputField:   [this.myObject.inputValueField, [Validators.required,Validators.minLength(4),
            forbiddenValueValidator(5000)]]
    });
  

Итак, в этом случае у меня был бы ввод, который требуется, имеет минимальную длину 4 и не может быть равен 5000, принудительно выполняемый пользовательской функцией проверки.

Извините, если есть какие-либо дубликаты, подобные этому, но я не смог найти ничего, что действительно указывало бы на решение динамического / метаданного подхода к нескольким валидаторам с созданием экземпляра нового FormControl

Редактировать:

Вот моя потенциальная идея для исправления:

Я думаю, что теперь я понял, хотя, примерно, это так:

 validations = {
    required: true,
    minLength:true,
    customCalls: [forbiddenValueValidator(5000)]
};

    let myValidators = [];
    if(this.validations.required) {
        myValidators .push(Validators.required);
    }
    if(this.validations.minLength) {
        myValidators .push(Validators.minLength(4));
    }
    if(this.validations.customCalls amp;amp; this.validations.customCalls.length > 0) {
        for (let customCall of this.validations.customCalls) {
            myValidators .push(customCall);
        }
    }
  

объект validations может быть другой частью метаданных json, представляющих данные вопросов, а остальное может быть быстрой функцией, которая просто создает массив для валидаторов. Тогда создание элемента управления будет выглядеть следующим образом:

  group[question.key] = myValidators.length > 0 ? new FormControl(question.value || '', myValidators)
                                      : new FormControl(question.value || '');