Ионное редактирование данных элемента в массиве ngFor - PullRequest
Новая
       6

Ионное редактирование данных элемента в массиве ngFor

0 голосов
/ 11 мая 2018

Итак, у меня есть list.html и list.ts файл

Это мой список, используя *ngFor

<ion-list>
    <ion-item *ngFor="let item of items">
        <h2>{{item.name}}</h2>
        <p>{{item.description}}</p>
        <p>{{item.amount}}</p>
        <p>{{item.uniqueID}}</p>
    </ion-item>
</ion-list>

А в lists.ts у меня есть функция, которая получает новые данные о событиях, 

this.events.on('dataAvailable', (data) => {

      for (var i = 0; i < data.length; i++){

        this.ngZone.run(() => {

          this.items.push({
            name: data[0].name,
            description: data[0].description,
            amount: data[0].amount,
            uniqueID: data[0].uniqueID
          });  

        });

      }

});

Это работает нормально, и новые данные добавляются в список каждый раз событие происходит. Однако событие может содержать данные для уже существующий элемент в массиве.

Я понимаю, что могу найти index уже существующего предмета в items и обновить данные таким образом, однако мне нужно более прямое подход к редактированию существующих данных, вероятно, uniqueID.

Помощь очень ценится, спасибо!

1 Ответ

0 голосов
/ 11 мая 2018

Сопоставьте массив с uniqueID, чтобы увидеть, существует ли новый элемент, а затем решите, что делать на основе индекса: 

this.ngZone.run(() => {
  let index = this.items.map(x => x.uniqueID).indexOf(data[0].uniqueID);
  let newItem = {
    name: data[0].name,
    description: data[0].description,
    amount: data[0].amount,
    uniqueID: data[0].uniqueID
  }
  if (index !== -1) {
    this.items.push(newItem);
  } else {
    this.items[index] = newItem;
  }
});
...