Ionic2 离子2-列表更新不'；除非刷新页面，否则无法在UI中反映

我的模板：

<ion-item-sliding *ngFor="let draft of drafts">
    <ion-item>
        <h2>Report draft header</h2>
    </ion-item>
    <ion-item-options side="left">
        <button ion-button color="secondary" (click)="draftUpload(draft.report.pk)">
            <ion-icon name="md-cloud-upload"></ion-icon>
            Upload
        </button>
    </ion-item-options>
</ion-item-sliding>

下面是getDraftReports（）函数：

getDraftReports() {
    var draftReports = [];
    let reportObj : any;
    this.storage.forEach((value, key, index) => {
        reportObj = JSON.parse(value);

        if(reportObj.report.uploaded=="no"){
            draftReports.push(reportObj);
        }
    });
return draftReports;

}

这不起作用，尽管对数据库进行了更改。如果我刷新页面，或来回导航，列表将更新

---

我做错了什么？

这似乎是一个变更检测问题。每次浏览器事件、超时或http请求都会触发更改检测

在这种情况下，函数：getDraftReports（）是异步的，并且它的回调不会检测到角度，因此它不会触发更改检测事件以更新视图

为了解决这个问题，你必须把这个函数包装成角度区域。请参阅此代码：

进口区：

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

注入服务区域：

constructor(private zone: NgZone) {
    ....
}

最后将其添加到函数中：

draftUpload(pk) {
   this.dataService.uploadReport(pk);
   this.zone.run(
    () => {
       this.drafts = this.dataService.getDraftReports();
    }
   )
}

---

希望这有帮助。

this.storage.foreach返回一个承诺，因此是异步的

您的

draftReports

数组在设置之前已返回。您需要返回承诺：

getDraftReports(draftsHandler:any) {
    //var draftReports = []; 
    //Use a filter method and return the promise.       
    return this.storage.forEach((value, key, index) => {
        let reportObj : any;
        reportObj = JSON.parse(value);
        if(reportObj.report.uploaded=="no"){
            //draftReports.push(reportObj);
             draftsHandler(reportObj);
        }
    });
}

在

draftUpload中

在

中设置
草稿
，然后

draftUpload(pk) {
    this.dataService.uploadReport(pk);
    this.dataService.getDraftReports((data)=>this.draftsHandler(data)).then(()=>{
       //next steps
    }
}
   draftsHandler(data:any){
     this.drafts.push(data)
   }

---

this.dataService.getDraftReports（）

你能添加这个代码吗？@suraj我添加了这个函数的代码。

这个.storage

是ionic storage吗？是的，Ionic2 storage:从'@ionic/storage'导入{storage}；是的，它不起作用。您的函数正在返回一个空数组。问题是forEach是异步的。请参阅@suraj responsed您是否介意解释上述内容的工作原理？你必须返回对账单。首先返回承诺本身，然后还返回if条件内的reportObj。我得到了一些非常奇怪的结果，这是我没有得到的部分。目标是返回承诺以及满足if条件的所有对象。是。。getDraftReports将返回您要返回的

forEach

函数。当调用

时，

将解析forEach以返回满足条件的obj。您得到了什么奇怪的结果？在promise运行后，我只得到一个对象，而不是许多（我期望的）对象。好的。。。循环正在中断，因为它返回它看到的第一个循环

draftUpload(pk) {
    this.dataService.uploadReport(pk);
    this.dataService.getDraftReports((data)=>this.draftsHandler(data)).then(()=>{
       //next steps
    }
}
   draftsHandler(data:any){
     this.drafts.push(data)
   }