Question

我是离子新手。我试图创建一个搜索蓝牙设备的应用程序并显示它们。我创建了一个搜索蓝牙设备的服务。当设备发现事件发布如下：

this.event.publish("ibeacon", newBeacon);

这是我的事件注入：

import { Events } from 'ionic-angular/util/events';
......
constructor(private event: Events){}

以下是我订阅该活动以获取已发布数据的方式：

this.event.subscribe("ibeacon", (newBeacon) => {
  this.iBeacons.push(newBeacon);
});

正如你所看到的，我已经宣布了一个iBeacons数组，我在那里推送我收到的对象。问题是当我尝试显示iBeacons数组内容时没有显示任何内容。这是我显示我的数组的方式：

<ion-content padding>

  <ion-list>
   <ion-item *ngFor="let beacon of iBeacons">
     <ion-label>
      {{ beacon.hash }}
     </ion-label>
   </ion-item>
 </ion-list>

</ion-content>

开头的数组为空。当我订阅活动时，我已经检查过并且我收到了正确的设备。我不会得到错误。我没有显示数据，因为数据是在iBeacons数组中异步添加的。有什么想法吗？

以下是一些iBeacons数组包含：

(4) [{…}, {…}, {…}, {…}]
0: {hash: "b5d787ac973341a59bf73838eededcb4", uuid: "fda50693-a4e2-4fb1-afcf-c6eb07647825", major: "10001", minor: "10301", lastFoundTime: 1518003454401}
1: {hash: "50aee081c9833e51ce00b9aa4a0c062d", uuid: "fda50693-a4e2-4fb1-afcf-c6eb07647825", major: "10001", minor: "10206", lastFoundTime: 1518003454391}
2: {hash: "1c8ecafb6efbbc37f905d95551291672", uuid: "fda50693-a4e2-4fb1-afcf-c6eb07647825", major: "10001", minor: "10208", lastFoundTime: 1518003454391}
3: {hash: "442e383d9c582985083b5b05f07161d2", uuid: "fda50693-a4e2-4fb1-afcf-c6eb07647825", major: "10001", minor: "10205", lastFoundTime: 1518003454392}
length: 4
__proto__: Array(0)

这是iBeacons数组初始化：

iBeacons:any [] = [];

Answer 1

尝试使用ChangeDetectorRef，如下所示：

import { ChangeDetectorRef } from '@angular/core';

constructor(private cd: ChangeDetectorRef) {}

this.event.subscribe("ibeacon", (newBeacon) => {
  this.iBeacons.push(newBeacon);
  this.cd.detectChanges();
});

ion-list显示异步向数组添加数据

1 个答案: