189 8069 5689
源码：https://github.com/Karin001/ngx-dynamic-form
动态表单使用场景
有时候我们需要一个灵活的表单，这个表单可以根据用户的选择，或者服务器返回的信息进行重新配置，比如：增加或删除一组input元素、一组select元素，等等。
在这样的情况下，如果一开始就在模板里写下所有的表单，利用一个ngif树状结构进行选择控制，程序会变得比较冗余。
这时。程序最好是能够根据用户的选择（driven by configuration）或者服务器的响应，自动生成所需要的表单。这就是动态表单要处理的业务。
组件生成的相关概念组件的两个构成
要动态生成表单，需要先理解组件是如何生成的。
一个angular组件由两部分所组成。
Wrapper
Wrapper能够与组件进行交互，当一个Wrapper初始化完成后，就已经帮我们实例化了一个组件。同时，它也负责组件的change detection，以及触发钩子函数比如ngOnInit，ngOnChanges。
View
View负责呈现渲染过后的模板，将组件的外貌展示出来，并且能够触发Wrapper的change detection。一个组件可以有多个view，每一个view可以通过调用angular提供的两个函数自行生成和销毁，这个过程不用顶层的视图参与。
组件的通常加载方式（非动态加载方式）
通常情况下，我们都是把组件内嵌到根组件或者另一个组件当中使用。嵌入的组件称为子组件，被嵌入的称为父组件。这时，当我们的子组件代码在被编译时，会生成一个组件工厂component factory（这是angular核心类ComponentFactory的一个实例），和一个hsot view，host view负责本组件在父组件视图内生成该组件的dom节点，以及生成该组件的wrapper和view。
动态加载组件
而当我们想要将一个动态组件插入某个组件视图时，则无法取得这个动态组件的实例，因为这些是非动态组件编译器做的事。
实现动态组件
angular提供了一些函数解决上面的难题，要使用这些函数我们需要注入两个对象。
constructor(
private componentFactoryResolver: ComponentFactoryResolver,
private viewcontainerRef: ViewContainerRef,
) {
}另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。