Wrong displayed values in dynamically added elements

Ionic Framework ionic-v3
1

EDIT 2: I have kind of solved it by replacing [(ngModel)]="item.value1" with value={{item.value1}}. The change works just fine for me, but I still want to know the solution to my original question. Thanks.

I have a form that has parts of it that can be dynamically expanded.

<div *ngFor="let item of itemArray; let index = index">
        <ion-item>
          <ion-label color="primary">{{index+1}}</ion-label>
          <ion-input type="text" [(ngModel)]="item.value1" ></ion-input>
          <ion-input type="text" [(ngModel)]="item.value2" ></ion-input>
        </ion-item>

        <span ion-button float-left icon-left clear (click)="Remove(index)">
          <ion-icon name="close"></ion-icon>Remove
        </span>
</div>

<span ion-button float-left icon-left clear (click)="Add()">
        <ion-icon name="add"></ion-icon>ADD
</span>

In the ts file

Add(){
    this.itemArray.push({
      'value1':'',
      'value2':''
    });
  }

  Remove(i){
    this.itemArray.splice(i, 1);
  }

If i just manually type into each input field, everything displays just fine. But I have another function that dynamically changes the itemArray like this

changeInput(change, index){
    this.itemArray[index]['value1'] = change;
}

Problem arises when I call the changeInput function, instead of just changing the particular input field, all of the input field that is pointed to ‘value1’ is changed into the same thing, however, if I console log the array, everything in the array appears to be correct. So something is wrong with how the front end is displayed.

Is there something that I’m doing wrong, or are the dynamically added input fields unable to be changed like that.

EDIT 1: upon further testing, every dynamically added fields’ front end value are all updated to the nothing after called Add(), however, the itemArray is still correct after console logging it, it still keeps whatever was entered in it and the empty newly added member.