ionic3 - ERROR Fehler: Uncaught (in Versprechen): Fehler: InvalidPipeArgument: '[Objekt Objekt]' für die Pipe 'AsyncPipe' - Javascript, Typoskript, ionic-Framework, ionic3

Ich habe eine Nachrichtenkommentarfunktion von ionic3 mit Firebase ausgeführt, nachdem die Kommentarfunktion bereits getestet wurde, aber wenn der Kommentar in meinem Projekt angezeigt werden soll, tritt ein Fehler auf.

ERROR Error: Uncaught (in Versprechen): Error: InvalidPipeArgument: "[Objekt Objekt]" für Pipe "AsyncPipe"

Mein Projekt folgt diesem TUTORIAL.

HTML-Datei

<ion-list>
<ion-item-group *ngFor="let contact of contactsList | async">
<ion-item>
{{contact.$value}}
</ion-item>
</ion-item-group>
</ion-list>

<ion-list>
<ion-row>
<ion-col col-6>
<ion-input type="text" [(ngModel)]="Contact" placeholder="写评论..."></ion-input>
</ion-col>
<ion-col>
<button ion-button color="primary" (click)="addContact()">发布</button>
</ion-col>
</ion-row>
</ion-list>

ts datei

 import { AngularFireList } from "angularfire2/database";

export class NewsDetailPage {
new: any;
contactsList:AngularFireList<any>;
Contact = "";

constructor(public navCtrl: NavController, public navParams: NavParams,
private qq: QQSDK, private socialSharing: SocialSharing,
public firebaseService:FirebaseServiceProvider,public alertCtrl: AlertController
// private photoViewer: PhotoViewer
) {
this.new = navParams.get("new");
this.contactsList = this.firebaseService.getContactsList();
}

addContact() {
this.firebaseService.addContact(this.Contact);

const alert = this.alertCtrl.create({
title: "评论成功！",
//subTitle: "Your friend, Obi wan Kenobi, just accepted your friend request!",
buttons: ["确认"]
});
}

AKTUALISIEREN:

  getContactsList() {
return this.angularfiredb.list("/contactsList/");
}

Antworten:

2 für die Antwort № 1

Sie müssen zuerst die AngularFireList in eine Observable konvertieren:

contactsList: Observable<any[]>;

Und in Ihrem Konstruktor müssen Sie aufrufen valueChanges() darauf. Dies ist seit AngularFire2 Version 5.

this.contactsList = this.firebaseService.getContactsList().valueChanges();

Dadurch werden die Daten über das Observable ohne zurückgegeben $key oder $value. Um in HTML zu drucken, verwenden Sie

  {{contact}}

Anstatt von

  {{contact.$value}}

---

1 für die Antwort № 2

Versuchen Sie, Ihre contactsList Deklaration von

contactsList:AngularFireList<any>;

zu

contactsList: Observable<any[]>;

Stellen Sie sicher, dass Sie Ihre importieren Observable Modul als,

import { Observable } from "rxjs/Observable"

Auch dein contactList Variablenbelegung sollte geändert werden als,

this.contactsList = this.firebaseService.getContactsList().valueChanges();

Hoffe das hilft!

---