Angular 2提交动态组件

Question

我正在从来自服务器的 json 开始创建动态组件。 为此，我使用了官方指南中的示例 https://angular.io/guide/dynamic-component-loader

loadComponent(requiredFields) {
    let bankInput : InputItem;
    let bankItem = requiredFields[0];
    if (bankItem.nature == "text"){
        bankInput = new InputItem(InputTextComponent,bankItem);

    }


    let componentFactory = this.componentFactoryResolver.resolveComponentFactory(bankInput.component);

    let viewContainerRef = this.inputHost.viewContainerRef;
    viewContainerRef.clear();

    let componentRef = viewContainerRef.createComponent(componentFactory);
    (<InputBankComponent>componentRef.instance).data = bankInput.data;


  }

显然这是一个只支持文本的 sn-p。

一切正常，但现在我必须将生成的字段提交到服务器。

如何将生成的字段放入表单中？ 有什么更好的方法？

Answer 1

你查看过关于forms 的官方文档吗？

您还可以阅读FormBuilder 来动态构建表单，这是一个示例（使用现有的验证器）：

this.form = this.fb.group({

   Address1: [address.Address1, this.validator.buildAddressValidators()],
   Address2: [address.Address2, this.validator.buildAddressValidators()],
   Address3: [address.Address3, this.validator.buildAddressValidators()],
   Address4: [address.Address4, this.validator.buildAddressValidators()],

   ZipCode: [address.ZipCode, this.validator.buildZipCodeValidators(true)],
   City: [address.City, this.validator.buildCityValidators(true)]
});