How to set [(ngModel)] dynamically for ion-input


#1

I use ion-input in for loop, so I want to set ngModel for ion input dynamically and also get the value of each input


#2

Your question is very poorly phrased, but I think you are looking for something like this (html):

<div *ngFor="let input of myInputList">
  <ion-input [(ngModel)]="input">
  </ion-input>
</div>

And something like this in your typescript file:

myInputList: string[] = ["", "Hello World", "Bye World"];

This would render three inputs, one empty, one with hello world prewritten and one with bye world pre written.


#3

Thnx for reply,
Actually, I have JSON array with multiple fields like:

for (let i = 0; i < 6; i++) {
let data = {
“id”:i,
“catCode”: “CAT code” + [i],
“BA”: “500”
}
this.catCode.push(data);
}
and for each cat code have one input text box

so in this condition how it works ?


#4
<div *ngFor="let input of myInputList">
  <ion-input [(ngModel)]="input">
  </ion-input>
</div>

This ain’t going to fly. You cannot bind this way.


#5

Try this

See home.html and home.ts


#6

Thnx @Tommertom it works properly :slight_smile: