Angular2-动态组件/重新加载模块的更改模板

我有一个动态组件，它在运行时接收其模板，并使用编译器的compileModuleAndAllComponentsSync方法从'@angular/core'动态编译

下面是我用来获取运行时组件的componentFactory的代码（请参阅Plunker以获取完整的代码，所有有趣的内容都在runtime content.component.ts中）

私有createComponentFactorySync（编译器：编译器，元数据：组件）：组件工厂

这一切都很好，动态模板在第一次编译时也很好。但是，对于我的用例，我需要能够更改模板并重新编译多次。但是当我第二次尝试编译时，我得到了错误

“类型RuntimeComponent是两个模块声明的一部分：RuntimeComponentModule和RuntimeComponentModule！”

这当然是有意义的，因为它确实编译成了相同类型的另一个模块。因此，我的想法是尝试卸载先前创建的模块，但找不到任何方法

有人知道我想做什么吗？可能通过卸载模块或其他方式。我提供了一个工作的plunker来说明问题。按下“编译”按钮将编译工作正常的动态模板（按下“Inc”按钮将增加值）。再次按“编译”将引发上述错误，组件将停止工作

我将使用
编译器解决您的问题。clearCacheFor
方法：

compiler.clearCacheFor(decoratedCmp);


另见



另一种解决方案是为每个新组件声明一个新类，并且不要每次重复使用相同的
RuntimeComponent

protected createNewComponent(tmpl: string) {

    @Component({
        selector: `runtime-component-dynamic`,
        template: tmpl
    })
    class RuntimeComponent {
        name: string = 'Tim Jelly';
        value: number = 42;

        incValue() {
            this.value++;
        }
    }

    return RuntimeComponent;
}

请参见
请澄清您的具体问题或添加其他详细信息，以突出显示您所需的内容。正如目前所写的，很难准确地说出你在问什么。请参阅How to Ask页面以获得帮助，以澄清此问题。Plunker不起作用。请更新它。我正在搜索上周的此类内容。您的示例正是我需要的。请更新它。因此我可以进行测试，我还希望使用模板编译javascript@Richard Houltz感谢Ia（几乎很容易；）它一直坐在我面前。美好的
protected createNewComponent(tmpl: string) {

    @Component({
        selector: `runtime-component-dynamic`,
        template: tmpl
    })
    class RuntimeComponent {
        name: string = 'Tim Jelly';
        value: number = 42;

        incValue() {
            this.value++;
        }
    }

    return RuntimeComponent;
}