离子 - Onesignal - 论handleNotificationReceived不更新视图

Question

我尝试更新一个阵列中后收到的通知从Onesignal像这样：

getMsg.ts：

getMsg = Array<Object> = []; 
... 
constructor(... private oneSignal: OneSignal ...) { 
... 

    this.oneSignal.handleNotificationReceived().subscribe(() => { 

     this.getMessage(); 
     console.log('handleNotificationReceived');     
    }); 
} 

getMessage() { 

    this.getMsg.push({ text: 'some text' }); 

    console.log('getMessage'); 

    // Push is working 
    console.log(JSON.stringify(this.getMsg)); // [{"text":"some text"}] 
} 

getMsg.html：

... 
<ion-list *ngFor="let m of getMsg"> 
    <ion-item> 
     <p>{{ m.text }}</p>    
    </ion-item> 
</ion-list> 
... 

但它没有按预期工作。

我在我的getMsg.html文件中有一个<textarea>，当我输入它时，视图神奇地更新（在我收到通知之后）。

很明显，如果我直接使用功能getMessage()，它的工作原理。

我尝试过，是更新/重装的观点：

this.navCtrl.setRoot(this.navCtrl.getActive().component); 

，但没有运气。

Ionic: v3.4.0 
Cordova: v7.0.1 

Answer 1

后打破了我的大脑的几天里，我用下面的网站的帮助下解决这个问题：

• Understanding Zones and Change Detection in Ionic 2 & Angular 2

角2个运行的内部自己的特殊称为NgZone的区域。在区域内运行允许检测何时异步任务 - 可以改变应用程序的内部状态并因此改变其视图的事物 - 开始和结束。由于这些异步任务是唯一会导致我们的视图发生变化的事情，通过检测它们何时执行，Angular 2知道视图可能需要更新。

解决方案代码：

// Import NgZone 
import { Component, NgZone } from '@angular/core'; 

// We add it to the constructor 
constructor(... private zone: NgZone, private oneSignal: OneSignal ...) { 
... 

    this.oneSignal.handleNotificationReceived().subscribe(() => { 

     this.getMessage(); 
    }); 
} 

getMessage() { 

    // And here we run "NgZone" 
    this.zone.run(() => { 

     this.getMsg.push({ text: 'some text' }); 

    });  
}