I am trying to dynamically create the component to register in Golden Layout. Eg,
@ViewChild('placeholder', { read: ViewContainerRef }) viewContainerRef;
ngAfterViewInit(){
this.myLayout.registerComponent('testComponent', (container, componentState) => {
//Create an empty div on the container
container.getElement().html("<div #placeholder></div>");
this.componentFactory = this.componentFactoryResolver.resolveComponentFactory(TestComponent);
this.cmpRef = this.viewContainerRef.createComponent(this.componentFactory);
this.cmpRef.changeDetectorRef.detectChanges();
GlDirective.componentCount++;
});
}
However , because viewContainerRef is referring to ViewChild that only gets created now , it is always undefined. How can we create a component in RC5 that uses dynamically added div like the one above. I used @Günter Zöchbauer 's answer on Angular 2 dynamic tabs with user-click chosen components to derive to this. However unsure on how this can be achieved with Golden Layout which needs the DOM to be generated on the fly. Please help.