Ionic 3: Error trying to diff '[object Object]'

Question

I want to display FCM push notification to homepage in a form of loop. However, I received this error

HomePage.html:18 ERROR Error: Error trying to diff '[object Object]'. Only arrays and iterables are allowed(…)

I am sorry.. stil new in Ionic 3 (and typescript), anyway thank you in advance

Here's my code:

app.component.ts

      // Receiving token from FCM
      FCMPlugin.getToken(
        (t) => {
          console.log(t);
        },
        (e) => {
          console.log(e);
        }
      );

      // Receiving notification when app is in background
      FCMPlugin.onNotification(
        (infos) => {
          this.dataProvider.fcmPassing(infos);
          console.log(infos);

          // Display notification when app on foreground
          let basicAlert = this.alertCtrl.create({
            title: infos.title,
            subTitle: infos.body,
            buttons: ['OK']
          });
          basicAlert.present();
          },
        (e) => {
          console.log(e);
        }
      );

data.ts

  // Calling FCM data
  fcmReceiving() {
    return this.storage.get('fcmData');
  }  

  // Saving FCM data
  fcmPassing(infos) {
    this.storage.set('fcmData', infos);
  }

home.ts

 infos: Promise<any>;
 public notis = [];

 // Calling FCM data via DataProvider
this.dataProvider.fcmReceiving()
.then((info) => {
  console.log('fcm data', info);
  this.infos = info.title;
  this.notis = info;
}) 

home.html

  <ion-list>
    <ion-item *ngFor="let noti of notis" (click)="passingFCM(infos)">Hello {{noti.title}}</ion-item>
  </ion-list>

Answer 1

You commented that notis is an array, but you imply in your code example that the retrieved info is an object:

console.log('fcm data', info);
this.infos = info.title;
this.notis = info;

In this case, this.notis is not an array. It is whatever info is, which in your case is not an array as it contains other data, like info.title

set this.notis to the array within info