Ошибка при работе с AngularFireList, получение данных

Мне удалось выполнить это руководство для записи данных в мою базу данных Firebase. Однако, следуя этому руководству, я понял, что он использует «FirebaseListObservable», который теперь обновлен до «AngularFireList». Я изменил это, и чтобы заставить это работать, я должен был убедиться, что я сохранил свою транзакцию как объект, а не массив, который он сделал.

Мой код: transactionRef$: AngularFireList<transaction>

Его код: shoppingItemRef$: FirebaseListObservable<ShoppingItem[]>

Как я уже сказал, это исправило мою ошибку здесь, и мои данные были правильно зарегистрированы в базе данных. Однако, продолжая изучение руководств и пытаясь получить данные, я быстро получил эту ошибку:

Ошибка: InvalidPipeArgument: «[object Object]» для канала «AsyncPipe»

HTML

<ion-content padding>
    <ion-list>
        <ion-item *ngFor="let transaction of transactionRef$ | async">
            <h2>Currency: {{transaction.transactionCurrency}}</h2>
            <h3>Amount: {{transaction.transactionAmount}}</h3>
            <h4>Receiver: {{transaction.transactionReceiver}}</h4>
        </ion-item>
    </ion-list>
</ion-content>

TS

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';

import { AngularFireDatabase, AngularFireList } from 'angularfire2/database'; 
import { transaction } from '../../models/transaction/transaction.interface';

@Component({
  selector: 'page-view',
  templateUrl: 'view.html',
})
export class ViewPage {

  transactionRef$: AngularFireList<transaction>

  constructor(public navCtrl: NavController,public navParams: NavParams, private database: AngularFireDatabase) {

    this.transactionRef$ = this.database.list('transaction');
  }
}

Чтобы исправить это, я изменил эту строку: <ion-item *ngFor="let transaction of transactionRef$ | async">

To: <ion-item *ngFor="let transaction of transactionRef$">

Однако это дало мне следующую ошибку:

Ошибка: не удается найти другой вспомогательный объект «[object Object]» типа «object». NgFor поддерживает привязку только к Iterables, таким как Arrays.

После прочтения этих двух ошибок становится ясно, что ошибка связана с несовместимыми типами объекта и массива. Однако я не знаю, как это исправить. Я прочитал несколько сообщений с людьми, имеющими эти две ошибки, но большинство из них либо работают с JSON (я нет), либо используют «FirebaseListObservable» и, следовательно, могут исправить свою ошибку, либо изменив ее с объекта на массив, либо исключив "| aysnc", ни один из них не работает для меня.

Любая помощь будет принята с благодарностью.


person C.Gibbons    schedule 25.10.2018    source источник


Ответы (1)


Если вы хотите получить Observable<Response> из AngularFireList начиная с 5.x, используйте функцию valueChanges().

this.transactionRef$ = this.database.list('transaction').valueChanges();

Обратитесь - https://github.com/angular/angularfire2/blob/master/docs/version-5-upgrade.md#50

person Sunil Singh    schedule 25.10.2018
comment
Извините за мое невежество. Я новичок в работе с angular. Я что-то упускаю? как оператор импорта или? Я отредактировал свой код, как вы сказали, но получил эту ошибку: Тип «Observable‹{}›» не может быть назначен типу «AngularFireList, транзакция›». Свойство «запрос» отсутствует в типе «Наблюдаемый‹{}[]›». (свойство) ViewPage.transactionRef$: AngularFireList‹транзакция› - person C.Gibbons; 26.10.2018
comment
Вы пробовали с async или без него? - person Sunil Singh; 26.10.2018