Firebase 和 ionic 3 应用程序出错

Question

我的 ionic 3 和 angular5 应用程序出现此错误。

类型“Observable”不可分配给类型“Observable”。类型 'any[]' 不可分配给 输入“菜单”。 “any[]”类型中缺少属性“categories”。

我正在尝试从 FireBase 数据库中获取数据。 我的模型：

import { Category } from "./category.model";

export interface Menu {
    key?: string;
    categories: Category[]
}

import { Dish } from "./dish.model";

export interface Category {
    key? : string,
    category: string,
    description: string
    dishes: Dish[],
    imageName: string
}

export interface Dish {
    key?: string,
    imageName: string;
    name: string,
    description: string,
    price: number
}

数据服务：

@Injectable()
export class MenuService {

    private menuRef = this.db.list<Menu>('menu');

    constructor(private db: AngularFireDatabase) {

    }

    getMenu() {
        return this.menuRef;
    }
}

在 homepage.ts 我调用构造函数来获取这样的数据：

constructor(public navCtrl: NavController, public dataService: DataServiceProvider, private menuService: MenuService) {


this.menu = this.menuService.getMenu().snapshotChanges()
.map(
  changes => {
    return changes.map(
      c => ({
        key: c.payload.key, ...c.payload.val()
      }))
  }
);

这些是我的依赖项：

"dependencies": {
    "@angular/common": "5.0.3",
    "@angular/compiler": "5.0.3",
    "@angular/compiler-cli": "5.0.3",
    "@angular/core": "5.0.3",
    "@angular/forms": "5.0.3",
    "@angular/http": "5.0.3",
    "@angular/platform-browser": "5.0.3",
    "@angular/platform-browser-dynamic": "5.0.3",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic/storage": "2.1.3",
    "angularfire2": "^5.0.0-rc.6",
    "firebase": "^4.9.0",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "rxjs": "5.5.2",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"

问题出在哪里？

Answer 1

问题来了：

this.db.list<Menu>('menu');

db.list 返回一个数组，您稍后会在snapshotChanges() 中尝试将其分配给一个对象。你应该使用：

this.db.Object<Menu>('menu');