Angular 2 - 使用字符串解析Component Factory

dud*_*wad 3 typescript2.0 angular

这是针对Angular的2.1.0最终版本.

我正在尝试动态实例化从配置JSON文件传递的类型的组件.我能找到的最好的东西是ComponentFactoryResolver,然而我发现的所有用法似乎都是将实际Type对象传递给解析器.

有没有办法Type从字符串中获取?因为目前,将类型作为字符串传递给我错误:

No component factory found for MyComponent

相关代码:

StructureBuilder组件:

private renderComponent(config:any) {
    let configComponents = config.components;
    if(config.hasOwnProperty('components') && configComponents.length){
        for(let i = 0, len = configComponents.length; i < len; i++){
            this.componentResolver.resolveComponentFactory(configComponents[i]);
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

其中config.components是一个使用Typeas作为值的字符串数组.

并在模块定义(Structure.module.ts)

@NgModule({
    declarations: [
        MyComponent,
        StructureBuilder_Cmp
    ],
    entryComponents: [
        MyComponent
    ]
    //Etc...
});
Run Code Online (Sandbox Code Playgroud)

就稀疏文档而言,这正是你应该如何做到的.

如果我将传入的动态字符串更改为configComponents[i]实际导入的类型引用MyComponent,则可以.

基本上,问题是:有没有办法使用resolveComponentFactory字符串来解析组件,如果没有,是否有办法Type从字符串值获取引用?

dud*_*wad 9

我现在的解决方案是做我真正想要避免的事情,即维护一个key/val注册表.

let componentRegistry = {
    'SomeComp1': SomeComp1, 
    'SomeComp2': SomeComp2
}
Run Code Online (Sandbox Code Playgroud)

然后调用它:

private renderComponent(config:any) {
    let configComponents = config.components;
    if(config.hasOwnProperty('components') && configComponents.length){
        for(let i = 0, len = configComponents.length; i < len; i++){
            let comp = configComponents[i];
            this.componentResolver.resolveComponentFactory(this.componentRegistry[comp]);
        }
    }
}
Run Code Online (Sandbox Code Playgroud)