Intento crear dinámicamente formularios de entrada con soporte para formularios. Funciona bien, ya que puedo agregar la directiva "formControlName" directamente en el elemento html.
Pero ahora no sé cómo puedo establecer la directiva en la instancia de un componente creado dinámicamente que se lleva a cabo en lugar de una plantilla ng.
la directiva myCustomComponentDirective crea un Componente por un Tipo dado (con ComponentFactoryResolver) y lo convierte en la plantilla ng. CustomComponent implementa controlValueAccessor y funciona si la directiva formControlName está etiquetada directamente en él.
¿Cómo agregar una directiva como "formControlName" dinámicamente en la directiva myCustomComponentDirective?
componente.html:
<form [formGroup]="formGroup"> <ng-container *ngFor="let singleForm of formConfigs;"> <ng-container [ngSwitch]="singleForm?.type"> <ng-container *ngSwitchCase="'input'"> <input formControlName="singleForm.conrolName" > </ng-container> <ng-container *ngSwitchCase="'custom'"> <!-- next line will not working since ng-template hasnt a nativeElement property --> <!-- <ng-template myCustomComponentDirective formControlName="singleForm.conrolName"></ng-template> --> <div myCustomComponentDirective formControlName="singleForm.conrolName"></div> </ng-container> </ng-container> </ng-container>la directiva donde quiero establecer formControlName:
Directive({ selector: '[customComponentDirective]', }) export class ComponentDirective implements OnInit { @Input() customComponentDirective: Type<any>; constructor(private _viewContainerRef: ViewContainerRef, private _componentFactoryResolver: ComponentFactoryResolver){} private _appendDirective(){ // here i want to add the directive when the component has been created.... mycreatedInstace.addDirective(formControlName); } }