Per creare forme reattive, un genitore FormGroup
è un must. Questo FormGroup
può contenere ulteriormente formControls
, child formGroups
oformArray
FormArray
può inoltre contenere un array di formControls
o uno formGroup
stesso.
Quando dovremmo usare formArray?
Si prega di leggere questo bellissimo post che spiega l'uso diformArray
L'esempio interessante in quel blog riguarda i viaggi formGroup
La struttura dei viaggi formGroup
utilizzando formControl
eformArray
sarebbe simile a:
this.tripForm = this.fb.group({
name: [name, Validators.required],
cities: new FormArray(
[0] ---> new FormGroup({
name: new FormControl('', Validators.required),
places: new FormArray(
[0]--> new FormGroup({
name: new FormControl('', Validators.required),
}),
[1]--> new FormGroup({
name: new FormControl('', Validators.required),
})
)
}),
[1] ---> new FormGroup({
name: new FormControl('', Validators.required),
places: new FormArray(
[0]--> new FormGroup({
name: new FormControl('', Validators.required),
}),
[1]--> new FormGroup({
name: new FormControl('', Validators.required),
})
)
}))
})
Non dimenticare di giocare con questa DEMO e nota l'utilizzo dell'array per cities
e places
di un viaggio.