Angular 2: Liste ist nicht aktualisiert bei laufendem IOS

Question

Ich arbeite in Angular 2-Projekt (und auch Ionic 2).

In meinem Projekt habe ich eine Seite, um Bilder-Liste anzuzeigen.

Benutzer kann hinzufügen/entfernen Bilder (von Cordova-Kamera-Plugin).

Mein Problem ist: Wenn Benutzer Bild entfernen, entferne ich es aus der Liste hinter UI. Debugging bei Chrome - Arbeit schön. ABER, versuchen Sie, auf IOS zu emulieren, oder wirklich auf Smart-Telefon zu testen, wenn Benutzer Bild löschen, wird die Ansicht nicht aktualisiert, bis er irgendeine Taste drückt. Was soll ich tun ???

Hier ist mein Code:

HTML:

<ion-list> 
    <ion-col width-50 *ngFor="let picture of pictures"> 
     <div> 
      <button (click)="checkAsGood(picture)">I like</button> 
      <button (click)="deletePicture(picture)"><ion-icon name="trash"></ion-icon></button> 
     </div> 
     <div> 
      <img [src]="picture.src" /> 
     </div> 
    </ion-col> 
</ion-list> 

Java Script:

private deletePicture(pictureRecord:Picture) { 
var self = this; 
    self.pictureService.deleteUserPicture(pictureRecord).then(function deleteSucceeded() { 

    self.pictures.splice(self.pictures.indexOf(pictureRecord), 1); 
    }, function deleteFaild(error) { 
    self.messagesService.showToastMessage(error.code) 
    }); 
} 

Answer 1

Anrufänderungserkennung

class MyComponent { 

    constructor(private cdRef:ChangeDetectorRef) {} 

    private deletePicture(pictureRecord:Picture) { 
     this.pictureService.deleteUserPicture(pictureRecord).then(() => { 
     this.pictures.splice(this.pictures.indexOf(pictureRecord), 1); 
     this.cdRef.detectChanges(); 
     }, (error) => { 
     this.messagesService.showToastMessage(error.code) 
     }); 
    } 
    } 

explizit

oder sicherstellen, dass der Rückruf in der Angulars-Zone ausgeführt wird, die sich bereits im Dienst befindet, indem zone.run(...) verwendet wird.

Es sieht wie eine Funktionalität aus, die Ihre pictureService Funktionalität verwendet, die nicht vollständig von dem zone.js-Paket auf IOS abgedeckt wird.