Рекурсивная ReactiveForm не может найти formGroups внутри шаблона

Я использую объект метаданных для динамического создания очень большой формы (~ 400 входных данных, хотя небольшой образец показан в примере stackblitz). Мне нужно использовать структуру метаданных для переноса информации, специфичной для ввода, на входы (например, тип ввода, выбор параметров, размер шага и т. д.). Когда мой html ng-шаблон рекурсивно вызывается внутри a и впоследствии, родительская форма не распознается. Когда я преодолею начальный уровень рекурсии, ReactiveForm не сможет отследить нужную группу форм.

По сути, formGroupName не может пройти через уровни рекурсивного шаблона.

Я некоторое время крутил свое колесо, пытаясь получить этот функционал, но безрезультатно.

У меня есть пример stackblitz того, что я пытаюсь сделать.

https://stackblitz.com/edit/angular-jndvkb

Любая помощь в выяснении того, почему путь вниз через FormGroup не работает внутри шаблонов, будет принят с благодарностью.


angular recursion reactive-forms ng-template
person Chris Reed    schedule 16.05.2019    source источник
comment
Выглядит довольно сложно. Я бы вообще избегал этой установки. Вы просматривали FormArray или это для полей динамической формы?   -  person robert    schedule 16.05.2019
comment
@robert Я пытался использовать только FormArrays, но мои входные данные будут варьироваться между type=text, type=number, select и checkbox. Я не верю, что в formControl есть место, где я могу хранить метаданные, необходимые для их различения. Мой основной вопрос заключается в html, с вызовом шаблона внутри div с formGroupName, а затем наличием элементов управления этой formGroup, доступных для вызова внутри этого шаблона (т.е. рекурсивность, которая мне нужна)   -  person Chris Reed    schedule 17.05.2019
comment
также отмечая, что мой конечный результат будет иметь входные данные на разных уровнях вложенности, а formGroups и formControls на одном уровне вложенности друг с другом.   -  person Chris Reed    schedule 17.05.2019

Ответы (1)


arrow_upward
0
arrow_downward

По какой-то причине formGroupName не может попасть в ng-container. Чтобы исправить это, я переместил formGroupName в верхнюю часть шаблона ng и изменил его на [formGroup]. Экземпляр formGroup передается в ng-template и там создаются вложенные/рекурсивные формы.

Решение stackblitz: https://stackblitz.com/edit/angular-k9saz2

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

Я также могу легко добавлять/удалять/редактировать входные данные, только изменяя начальное объявление formGroup в моем конструкторе. Это значительно упрощает техническое обслуживание в дороге.

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

person Chris Reed    schedule 17.05.2019