javascript - 如何在 Angular 2 中填充表单数组？

Question

假设我们有一个可以包含值数组的表单。
对于这种情况，Angular 为我们提供了 FormArray 类(class)。

this.form = new FormGroup({
  addresses: new FormArray([]),
})

我们还可以使用 NgForm#setValue .这可以用于使用从服务器检索到的一些数据来填充表单。

当我从服务器接收到新数据时，我想用该数据填充表单。例如，我的数据如下所示:

const data = {
  addresses: [
    { country: 'USA', city: 'New York' },
    { country: 'Germany', city: 'Berlin' },
  ]
}

现在是时候用这些数据填充表单了。
当我尝试简单地调用 this.form.setValue(data)我收到一个错误:

Cannot set property stack of [object Object] which has only a getter

如何用数据填充表单，但有以下要求:

我知道addresses的形状属性(property)。

我不知道 data.addresses 中的地址数量大批。

Answer 1

像下面这样尝试

this.form.setControl('addresses', this.formBuilder.array(this.data.addresses || []));