Golden Layout + Angular2 RC5 - 无法使用 ViewContainerRef 动态创建组件

Question

我正在尝试动态创建要在 Golden Layout 中注册的组件。例如，

    @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++;
    });
    }

但是，因为 viewContainerRef 指的是现在才创建的 ViewChild，所以它始终是未定义的。我们如何在 RC5 中创建一个像上面那样使用动态添加的 div 的组件。我使用@Günter Zöchbauer 在Angular 2 dynamic tabs with user-click chosen components 上的回答来得出这个结论。但是不确定如何使用需要动态生成 DOM 的 Golden Layout 来实现这一点。请帮忙。

Answer 1

不支持。

类似#placeholder的东西

container.getElement().html("<div #placeholder></div>");

只会被添加到浏览器中，Angular2 不会以任何方式识别或处理（出于安全目的的清理除外）。

模板变量只能通过静态添加到组件模板中来创建。