Angular 2创建包含FormArray的动态FormControl

Question

我有一个反应式输入表单，需要动态添加一些输入，我需要向其中添加表单控件。

父控件git reset FILE将包含可变数量的Mammals，并且每个MammalId将包含可变长度的FormArray。

我已经创建了打字稿代码，可以按照我的描述生成表单，但是，我无法将表单设置为HTML。

还有我生成的表单的示例：

我尝试通过以下方式将表单映射到我的html：

MammalId

但是当我尝试运行它时，我得到了：

  

错误：找不到具有未指定名称属性的控件

如何将html设置为表单值？

谢谢

Answer 1

父控件“哺乳动物”将包含可变数量的MammalId，并且每个“哺乳动物” ID将包含可变长度的FormArray。

据我了解，您期​​望的结婚可能是这样的

  [  
   {  
      "Mammals":[  
         {  
            "mammalId":[  
               {  

               }
            ]
         }
      ]
   }
]

对于上面的数组，表单将如下所示：

    this.inputForm = this.fb.group({
   Mammals: this.fb.array([}
   mammalId: this.fb.array([{
      z: ''
      }
   ])}
  ])
})

对于上面的数组html应该是这样

HTML

<form [formGroup]="inputForm">
<div formArrayName="Mammals">
  <div *ngFor="let mammal of inputForm.get('Mammals'); let i = index" [formGroupName]="i">
  <div formArrayName="mammalId">
    <div *ngFor="let id of mammal.get(mammalId); let z = index" [formGroupName]="z">
      <!-- parent form control -->

        <!-- mammals[i].id resolves to 'mammalIdx' -->

          <!-- this should map as the controls Form Array -->
          <input [formControlName]="z">
        </div>
      </div>
    </div>
    </div>
  </div>
  </div>
</form>

可能对您有帮助