Как получить последнее значение для динамически создаваемых элементов формы в угловой функции теста Yup? ⇐ Javascript

[Anonymous]

У меня есть схема в angular, которая проверяет элементы формы, все работает нормально для элементов формы, которые создаются при загрузке страницы, но у меня есть несколько элементов, которые создаются при нажатии кнопки.
Я добавляю новую группу форм при нажатии кнопки, которая добавляет группу форм в DOM. Затем я перебираю его, чтобы отобразить уже добавленную formGroup и динамически созданную formGroup.

Код: Выделить всё

                formArrayName="OptionsList"
class="form-group row"
*ngFor="let option of optionsList; let i = index"
>
Question Option {{ i + 1 }}:








Is Correct?


Mark The Option as Correct



Remove

Но я не могу проверить динамически созданную группу fomGroup при изменении. Проблема в том, что тестовая функция не получает правильное значение или обновленное значение только для этих динамически созданных элементов.
Взаимодействие с другими элементами формы обновляет значение динамически созданных элементов формы, но этого не происходит при взаимодействии с динамически созданными элементами. Да, функция проверки проверки запускается со значением false для IsCorrect, и это происходит и с OptionBody.

Код: Выделить всё

 OptionsList: Yup.array((
Yup.object().shape({
OptionBody: Yup.string().required('Option text is required').min(5),
IsCorrect: Yup.boolean().notRequired(),
})
))
.required()
.min(2, 'At least two options required')
.test('one-correct', 'Exactly one option must be correct', (arr) => {
return Array.isArray(arr)
? arr.filter((x) => x?.IsCorrect).length === 1
: false;
}),

Я попробовал добавить this.questionValidation.updateValueAndValidity(); где я добавляю элемент управления формой при нажатии кнопки и переназначаю валидациюSchema объекту формы вопросаValidation

Код: Выделить всё

  this.questionValidation.addValidators(
FormHandler.validate(this.validationSchema)
);

Вот как я добавляю динамический элемент управления формой

Код: Выделить всё

  const formGroupData = (
this.questionValidation.get('OptionsList')
);
const control = formGroupData.controls;

control.push(
this.fb.group({
OptionBody: '',
IsCorrect: false,
})
);

this.questionValidation.addValidators(
FormHandler.validate(this.validationSchema)
);
this.questionValidation.updateValueAndValidity();

Код: Выделить всё

questionValidation

— имя FormGroup.

Подробнее здесь: https://stackoverflow.com/questions/798 ... ngular-for