angular动态组建

0
88

比较好的教程:
https://segmentfault.com/a/1190000009175508

文中总结:
动态加载组件的流程:

1.获取装载动态组件的容器
2.在组件类的构造函数中,注入 ComponentFactoryResolver 对象
3.调用 ComponentFactoryResolver 对象的 resolveComponentFactory() 方法创建 ComponentFactory 对象
4.调用组件容器对象的 createComponent() 方法创建组件并自动添加动态组件到组件容器中
5基于返回的 ComponentRef 组件实例,配置组件相关属性 (可选)
6在模块 Metadata 对象的 entryComponents 属性中添加动态组件
declarations – 用于指定属于该模块的指令和管道列表
entryComponents – 用于指定在模块定义时,需要编译的组件列表。对于列表中声明的每个组件,Angular 将会创建对应的一个 ComponentFactory 对象,并将其存储在 ComponentFactoryResolver 对象中

动态组建要用到的3个功能:

ViewChild:

ViewChild装饰器来获取视图中的模板元素

ViewContainerRef

ComponentFactoryResolve

 

留下一个答复

Please enter your comment!
Please enter your name here