Ionic 2 List 未使用数据更新

Posted 2023-04-18

【中文标题】Ionic 2 List 未使用数据更新

【英文标题】：Ionic 2 List not updated with data

【发布时间】：2017-06-03 01:06:23

【问题描述】：

我正在尝试将 Socket.io 与 Ionic 2 一起使用。我正在尝试在绑定到数组的列表中显示接收到的数据。我有以下代码。

this.socket.on('Message', function(data)
  console.log("Received: " + data);
  this.messages.push(data);
)

而 html 看起来像，

<ion-content padding>
  <ion-list>
    <ion-item *ngFor="let msg of messages">
       msg 
    </ion-item>  
  </ion-list>
</ion-content>

虽然我可以在浏览器的控制台中看到数组正在更新，但该列表并未反映任何更改。我究竟做错了什么？任何建议都非常感谢。

【参考方案1】：

使用箭头函数() =>，否则this. 不会指向您当前的类实例。

this.socket.on('Message', (data) => 
  console.log("Received: " + data);
  this.messages.push(data);
)

https://developer.mozilla.org/en/docs/Web/javascript/Reference/Functions/Arrow_functions

【讨论】：

谢谢。那行得通。还在习惯这些新功能。