Suppose we have a form that can contain an array of values.
For this case Angular provides us with FormArray class.
this.form = new FormGroup({
addresses: new FormArray([]),
})
Also we have an ability to use NgForm#setValue. This can be used i.e. to populate the form with some data retrieved from server.
When I receive new data from the server, I want to populate the form with that data. For example, my data looks like this:
const data = {
addresses: [
{ country: 'USA', city: 'New York' },
{ country: 'Germany', city: 'Berlin' },
]
}
Now it's time to populate the form with this data.
When I try to simply invoke this.form.setValue(data) I get an error:
Cannot set property stack of [object Object] which has only a getter
How do I populate the form with data, but with these requirements:
- I know the shape of
addressesproperty. - I don't know the quantity of addresses in that
data.addressesarray.