Genero un componente dinámicamente
var componentFactory = this.componentFactoryResolver.resolveComponentFactory(TransportOrderComponent); let dynamicComponent = this.container.createComponent(componentFactory);Los enlaces de las propiedades dentro del componente dinámico no funcionan. (por ejemplo, ngIf, clic de botón, ...)
HTML del componente:
<button (click)="show = !show">toggle: {{show ? 'hide' : 'show'}}</button> <br> <div *ngIf="show"> Text to show</div>Componente mecanografiado:
... export class TransportOrderComponent { show: boolean = true; }Como componente estático todo funciona bien. Si agrego el componente dinámico y hago clic en el botón de componentes estáticos, el contenido del componente dinámico cambia una vez
Aquí hay un plunkr
Eso es porque está ejecutando código fuera de la zona angular.
Esto debería funcionar para usted
constructor(private zone: NgZone, ...) {} addTransportOrderComponent(jqContainer: any) { this.zone.run(() => { let componentFactory = this.componentFactoryResolver.resolveComponentFactory(TransportOrderComponent); let dynamicComponent = this.container.createComponent(componentFactory); }) }