in normal html we can do that:
<input name="xyz[]" value="Lorem" />
<input name="xyz[]" value="ipsum" />
<input name="xyz[]" value="dolor" />
<input name="xyz[]" value="sit" />
<input name="xyz[]" value="amet" />
and the result is array sent to the server.
how can i do that in angular 5 ?
it's not working the same way also not working in ngModel.
I have never used it, but can't you use an index?
<input type="text" [(ngModel)]="xyz[0]" />
<input type="text" [(ngModel)]="xyz[1]" />
<input type="text" [(ngModel)]="xyz[2]" />
<input type="text" [(ngModel)]="xyz[3]" />
I have seen this in this github's issue.
I used angular Form Group and this was the solve for this problem :
<div ngModelGroup="xyz">
<input name="1" ngModel />
<input name="2" ngModel />
<input name="3" ngModel />
</div>
Since you have a length on your array, you can either use reactive forms with a FormArray, or use template-driven forms. Since you stated using the latter one, here is how you should do it :
<ng-container *ngFor="let item of xyz; let i = index; trackBy: myCustomTrackBy">
<input type="text" [(ngModel)]="xyz[i]">
</ng-container>
In your Typescript :
myCustomTrackBy(index, item) { return index; }