Question

我是初学者ionic2

实际上我正在使用FCM插件进行推送通知。

这是我的app component.ts

     FCMPlugin.onNotification(function(d){
          if(d.wasTapped){  
            console.log(d);
           var nav=self.appCtrl.getActiveNav().setRoot(NotificationsPage);
       })

这是完美的。当我点击通知页面重定向到相应页面（通知页面）时。

我从firebase集合中检索数据并分配给数组。

数组变量名是Notifications.I安慰了数组值。它运行正常。

使用virtualScroll将数组显示到UI中。

在我的html代码下面。这是推送通知各自的页面（通知页面）

<ion-card class="card" [virtualScroll]="Notifications">
      <ion-item (click)="navigate(Notifications.value.TYPE,Notifications.value.FROM,Notifications.value.$key,Notifications.value.TO,Notifications.value.MSG,Notifications.value.STATUS,Notifications.time)" *virtualItem="let Notification">
        <ion-avatar item-left>
          <img  *ngIf="!Notification.userval.FILE" src="https://firebasestorage.googleapis.com/v0/b/apartments-ea9e5.appspot.com/o/default.png?alt=media&token=a64af538-17a7-46e1-9e38-383c1df060cf">
          <img *ngIf="Notification.userval.FILE" [src]="Notifications.userval.FILE">
        </ion-avatar>
         <p>{{Notification.value.MSG}}</p>
         <p>{{Notification.time}}</p>
         <p style="text-align:right;color:#334bfa;">{{Notifications.value.TYPE}}</p>
      </ion-item>
    </ion-card>

在我的通知页面下面的组件（ts文件）。

          this.authservice.getalluser().first().subscribe(namelist=>
              {
                 var users=[];
                 namelist.forEach(userval=>
                 {
                   users.push(userval.val());
                 })

                for(var i in val)
                {
                this.Time=val[i].SEND_TIME;
                var timeagoIns  = timeago();
                var result=timeagoIns.format(this.Time);
                console.log(result);
                 var user=users.filter(users=>users.USER_ID.toString() === val[i].FROM.toString());
                this.Notifications.push({
                     value:val[i],
                     time:result,
                     userval:user[0]
                  })
                Console.log(this.Notifications);
             })

数组值不会更新UI.But我控制了Notifications值。它工作正常。

为什么不更新数组值中的UI。

如何解决此问题。

请建议我，

感谢。

Answer 1

你是否像这样更新你的阵列？

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:padding="10dp" >

        <EditText
            android:id="@+id/edtTimerValue"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:ems="10"
            android:hint="minutes"
            android:inputType="phone" />

        <Button
            android:id="@+id/btnStartTime"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_weight="2"
            android:gravity="center"
            android:text="Start Timer" />

        <Button
            android:id="@+id/btnStopTime"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_weight="2"
            android:gravity="center"
            android:text="Stop Timer"
            android:visibility="gone" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tvTimeCount"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="00:00"
            android:textStyle="bold"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:padding="10dp" >

        <EditText
            android:id="@+id/edtTimerValue2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:ems="10"
            android:hint="minutes"
            android:inputType="phone" />

        <Button
            android:id="@+id/btnStartTime2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_weight="2"
            android:gravity="center"
            android:text="Start Timer"
            android:visibility="gone"/>

        <Button
            android:id="@+id/btnStopTime2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_weight="2"
            android:gravity="center"
            android:text="Stop Timer"
            android:visibility="gone" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tvTimeCount1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="00:00"
            android:textStyle="bold"/>

    </LinearLayout>

</LinearLayout>

如果您以这种方式更新阵列，则UI不应更新。因为您的阵列现在不在ngZone中。在这种情况下，您可以使用此

push.on('notification', (data) => {
    // update array
});

Ng For循环没有正确使用

1 个答案: