Clever Geek Handbook

Ng To refresh when new data is pressed

I have a set of reactive forms that I set up as an array of reactive forms:

typesForms: FormGroup[] = [];

What I am scrolling through in html:

<form *ngFor="let type of typesForms; let i = index" [formGroup]="typesForms[i]" class="row">

However, when I click on the new form, the HTML is not updated.

this.typesForms.push(this.formBuilder.group({
    type: { value: data['type'], disabled: true }
}));

I dumped the resulting data and rendered a new form object, but there was nothing at the front end. I'm guessing it has something to do with reactive forms, but I'm not sure if I am citing anything else.

+3


source to share


1 answer


Have you tried it only <form *ngFor="let type of typesForm" [formGroup]="type" class="row">

?

Update:

If you have multiple forms, you can use Angular's built-in FormArray data structure. It makes it easy to manipulate a set of form groups - makes it easy to track changes and check out related FormGroup

or FormControl

.



Punkr example

Note: thanks to the way things are structured under the hood ReactiveFormsModule

you can compose FormArray

s, FormGroup

and FormControl

how you want:

  • you can have an FormArray

    as a fieldFormGroup

  • FormArray

    can contain FormArray

    s, FormGroup

    and FormControl

    s
+1


source






More articles:


All Articles