javascript - 我想帮助在 Angular 5 中将 Firebase 数据库对象更改为数组

标签 javascript angular firebase firebase-realtime-database angularfire2

我正在尝试使用 Angular-Fire 2 查询 Firebase 的实时数据库以检索一组特定的条目。

{
  "items" : [ {
    "date" : "2017-10-16T00:00:00.000",
    "food" : "Pizza",
    "sport" : "Soccer"
  }, {
    "date" : "2017-10-15T00:00:00.000",
    "food" : "Ceviche",
    "sport" : "Basketball"
  }, {
    "date" : "2017-10-14T00:00:00.000",
    "food" : "Fruits",
    "sport" : "Cricket"
  } ]

  }

我只想返回“Food”及其前 20 个条目的值。

完成后,我想获取这些条目并将它们添加到数组中。

我被难住了。我不知道如何只拉回“食物”条目,并只将这些值添加到数组中。这是我到目前为止所拥有的。这就是我通常需要的。

items: Observable<any[]>;
  constructor(db: AngularFireDatabase) {

this.items = db.list('/items', ref => ref.limitToFirst(20)).valueChanges();

  }

  ngOnInit() {

  }

}

我希望能够对该数组进行插值,并且能够在函数中使用该数组。

最佳答案

这就是我设法将它们推送到 FireStore 中的数组的方法,除非 firebase 中存在其他重大差异,否则这也适用于您的设置。至少它可以提供一个起点。

foodlist: Array<any> = [];

  customFunction() {
    this.afs.collection<IItem>(`items`, ref => ref.limit(20)).snapshotChanges().pipe(map(foo => {
      return foo.map(bar => {
        const obj = bar.payload.doc.data() as IItem;
        const food = obj.food;
        return { food };
      });
    })).subscribe(a => {
      this.foodlist.push(a);
    });
    console.log(this.foodlist);
  }
}
export interface IItem {
  date: string;
  food: string;
  sport: string;
}

我编辑了一个更好的片段,它只返回食物。

对于firebase,array push方法应该是这样的:

db.list('/items', ref => ref.limitToFirst(20)).valueChanges().subscribe(a => {array.push(food, a.food)}) // if you can't use a.food, use {array.push(a)}

关于javascript - 我想帮助在 Angular 5 中将 Firebase 数据库对象更改为数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57734004/

相关文章:

javascript - 动画随机平铺背景

angular - 在 Angular 中使用 httpclient.post 发送和接收不同的类型

angular - 在 RxJs 5 中共享 Angular Http 网络调用结果的正确方法是什么?

ios - 在谷歌登录后使用 Swift 4 推送 View Controller

typescript - 使用 typescript 从 web sdk 使用 firebase 函数

javascript - 基于网络的浏览器 GPS 位置

javascript - 如何循环唯一目标ID? [jQuery]

javascript - 绘制星爆 - basil.js

javascript - 使用输入创建标签

ios - 谷歌云功能通知 iOS