9

我知道如何使用ComponentFactoryResolver.resolveComponentFactory(AComponentType)

但是该方法需要 a Type，而在我的代码中，我将类型的名称命名为 a string。

在 Angular API 中是否有解决方法string？如果没有，如何将字符串转换为TypeTypeScript 中的 a？

如果以上都不可能，我将求助于地图，但这并不是那么简单，因为我需要实例化的组件将来自远程获取的 UMD 角度组件库。

4

2 回答 2

4

您可以执行以下操作：

const classesMap = {
  AComponentType: AComponentType,
  BComponentType: BComponentType
}

接着：

CreateDynamicComponent(typeName: string) {
    ...
    const componentFactory = ComponentFactoryResolver.resolveComponentFactory(classesMap[typeName].prototype.constructor)
    ...
}
于 2018-07-26T08:33:44.907 回答
2

我遇到了同样的问题，我需要使用字符串来选择要构建的组件。经过一番挖掘，我创建了一个添加到NgModuleexport 和 entryComponents 列表的组件列表。

模板组件.ts

export const TEMPLATE_COMPONENTS: Type<any>[] = [
    Temp1Component,
    Temp2Component
  ]

在我的NgModule课堂上，我只是将 TEMPLATE_COMPONENTS 添加到exports和entryComponents

在与ComponentFactoryResolver您生成类型列表的组件中，具有相同的字符串作为键。

let templateTypes: { [name: string]: Type<{}> } = 
    TEMPLATE_COMPONENTS.reduce((p, c) => { p[c.name] = c; return p }, {})

// templateTypes = {'Temp1Component':Temp1Component,...}

this.componentFactoryResolver.resolveComponentFactory(templateTypes[string]);

这意味着您只需将组件添加到一个位置，从而简化了添加更多组件的过程。

它可能会TEMPLATE_COMPONENTS在单独的列表步骤中跳过整个列表并直接从NgModule类中获取列表，但这将是将来的某个时候。

于 2019-03-08T14:08:10.773 回答