Question

我正在研究一个有关CRUD的项目。

当我尝试在第一个应用程序中显示可观察的Firebase数据时（屏幕快照和代码被firstApplication调用），所有功能都在稳定运行。但是，当我在第二个应用程序中尝试使用这些代码（没有变量名时完全相同）时，我得到了

Observable<{}> not assignable to type Observable<any[]>错误，当我将鼠标置于变量下方的红线中

但是当我指望用于从火力地堡显示数据的离子选项时，数据是正确的。我只是不将其添加到数据索引中。。

Like That i put it "a" s for count easier.

第二个应用程序（不起作用）在下面

Red Line under at this.cityNameRef$ variables.

add-book.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { AngularFireDatabase , AngularFireList} from 'angularfire2/database'; 
import { Observable } from 'rxjs/Observable';
import { getNameOfCity } from '../../model/getNameOfCity.interface';

@Component({
  selector: 'page-add-book',
  templateUrl: 'add-book.html',
})

export class AddBookPage {
    //cityName = {} as getNameOfCity;
    //cityNameRef$: AngularFireList<getNameOfCity>
    cityNameRef$: Observable<any>;

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

        this.cityNameRef$ = this.database.list('Cities/').valueChanges();

    }
}

<ion-header>

  <ion-navbar>
    <ion-title>addBook</ion-title>
  </ion-navbar>

add-book.html

<ion-header>

      <ion-navbar>
        <ion-title>addBook</ion-title>
      </ion-navbar>

    </ion-header>

    <ion-content padding>

        <ion-select >
            <ion-option *ngFor="let form of cityNameRef$ | async">
                {{ form.nameOfCity }} {{form.value}} 
            </ion-option>

        </ion-select>

    </ion-content>

但是当我来到第一个应用程序（工作稳定）

Everything working stable and there is no error message but codes are same

add-book-working-stable.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { AddShoppingPage } from '../add-shopping/add-shopping'; 
import { AngularFireDatabase , AngularFireList } from 'angularfire2/database'; 
import { ShoppingItem } from '../../app/models/shopping-item/shopping-item.interface';
import { Observable } from 'rxjs/Observable';

@Component({
  selector: 'page-shopping-list',
  templateUrl: 'shopping-list.html',
})

export class ShoppingListPage {
     shoppingListRef$: Observable<any[]>;

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

    this.shoppingListRef$ = this.database.list('Cities/').valueChanges();

  }

  navigateToAddShoppingPage(){
    this.navCtrl.push(AddShoppingPage);
  }

}

-

 "ionic-angular": "3.9.2",
 "angularfire2": "^5.1.1",
 "rxjs": "^6.0.0",
 "rxjs-compat": "^6.3.3",

关于问题是什么或什么是我没有得到的任何想法。

还是谢谢！

Answer 1

它基本上说您的对象不是数组。当您对任何数组进行任何处理时，都应予以解决。

来自

 cityNameRef$:Observable<any>;

到

 cityNameRef$: Observable<any[]>;

AngularFirebase2，Ionic 3：通过Firebase返回数据无法完全正常工作

1 个答案: