Angular.io Dynamic Forms

Objetivo

A través de un conjunto de elementos (clases, servicios, componentes) el usuario puede definir un formulario con solo instanciar ciertas clases.

Consideraciones

* QuestionBaseClass: Clase base para los inputs, se definen por ejemplo las subclases TextboxQuestion (input text) y DropdownQuestion (input select)
* QuestionControlService: Transformar questions (inputs) a FormGroup
* DynamicFormComponent: Componente para iterar sobre los questions definidos, recibe como parámetro los QuestionBase’s e invoca a QuestionControlService para transformarlo a FormGroup (form). Por cada question definida llamará al subcomponente DynamicFormQuestion y le pasará como parámetro el form y la question.
* DynamicFormQuestionComponent: Por cada question definida, definira el template correspondiente (mediante un ng-switch). Prestar especial atención a las directivas del HTML las cuales se definen mediante propiedades de objetos!

Consideraciones principales

* Una opción interesante es la capacidad de indicar dinamicamente el nombre de los inputs, en el ejemplo se define a través de propiedades de objetos, por ejemplo: < input *ngSwitchCase="'textbox'" [formControlName]="question.key" [id]="question.key" [type]="question.type">