我有一些我想要动态添加到页面中的组件。
我的名字在配置文件config.json
中,目前是typescript类名MySuperComponent
。我可以在配置文件中放入任何我想要的东西,但是类名不适合。
我已经尝试了一些带有组件解析器的代码,但是我无法将字符串传递给它。
这有效:
this.resolver.resolveComponent(MySuperComponent)
这不是:
this.resolver.resolveComponent("MySuperComponent")
如何从String中实例化(并注入)组件?
答案 0 :(得分:1)
您可以设置地图并通过从字符串转换为类型
的服务提供import {MySuperComponent} from './MySuperComponent';
@Injectable()
class ComponentTypes {
types = {
MySuperComponent: MySuperComponent
};
toType(name:string) {
return types[name];
}
}
你在哪里使用它
@Component({
...
providers: [ComponentTypes],
})
class SomeComponent {
constructor(private componentTypes:ComponentTypes) {}
addDynamicComponent() {
...
this.resolver.resolveComponent(this.componentTypes.toType("MySuperComponent"))
}
}
答案 1 :(得分:1)
根据Pankaj的评论,您可以使用System.import
:
let componentPath = (...)
let componentName = 'MySuperComponent';
System.import(componentPath)
.then(fileContents => {
return fileContents[componentName]
})
.then(component => {
this.resolver.resolveComponent(component);
});