Angular 创建一个FormBuilder数组，其中包含由另一个输入表示的控件数

我正在编写Angular 5应用程序，此时我需要为其中一个属性使用FormBuilder数组。我有一个属性，它说明数组中应该有多少个控件，但找不到任何关于如何使用那么多控件创建FormBuilder数组的资源

该表单如下所示：

this.Form = this.fb.group({
    ...
    noOfControls: null, // 
    controls: <-- fb.array
});

this.Form=this.fb.group({
...
noOfControls:null，//
控件：您应该创建一个可观察对象来侦听noOfControls值，在这个可观察对象中，您应该调用一个方法，根据当前控件的长度向formArray添加或删除控件

假设这是你的表格

this.Form = this.fb.group({
    noOfControls: this.fb.control(null,[]),
    controls: this.fb.array([])
});

要收听控件的更改，可以使用

this.Form.valueChanges.map(values=>values.noOfControls).distinctUntilChanged()
.subscribe((num)=>{
     ...
    })

要轻松处理数组中的控件，可以创建一个方法，将控件作为数组返回

get control() {
 return this.form.get('controls') as FormArray
}

在订阅中，您应该具有某种逻辑，可以在每次数字更改控制数组长度时进行分析

if(this.control.length > num) {
 ... remove one control array item
}
if(this.control.length < num) {
 ... add the differences in the number of control items
}

if（this.control.length>num）{
…删除一个控件数组项
}
if（this.control.length

要删除最后一个元素，可以使用FormArray类中的
removeAt（index:number）
方法

要添加新的表单控件，可以使用
push（控件：AbstractControl）

如果需要更多帮助，请告诉我
返回包含所需控件的FormArray的函数如何？太好了，非常感谢！我将if语句包装在for循环中，以计算长度和num之间的差异，以便如果用户将长度超过1的数字放在距离长度适当的位置移动或添加额外的元素。最初我会使用while循环，但这似乎会导致它成为无限循环。轻微问题，如用户键入值太快（或者实际上是两位数）这个程序疯了。我假设这是因为代码在完成之前运行了多次。是否还要等待用户在执行代码之前停止键入？我最终放弃了这个想法，因为它有太多问题，但我将把这个问题留给其他人。