使用 Angular2、angularfire2 和 Typescript 从 Firebase 对象中获取数据

Posted 2023-03-08

【中文标题】使用 Angular2、angularfire2 和 Typescript 从 Firebase 对象中获取数据

【英文标题】：Getting Data out of Firebase Object with Angular2, angularfire2 and Typescript

【发布时间】：2016-11-10 13:45:02

【问题描述】：

我目前正在使用 Angular 2 和 angularFire2 进行项目。 我的数据库在 Firebase 中如下所示： 基础：/数据

[Name:test1,
Name:test2,
Name:test3]

所有项目也都有 Firebase 密钥。

现在我正在尝试使用来自 RX 的 Observabel 从 Firebase 中获取数据。 当我这样做时，我会在控制台中获得名称：

let items= af.database.list('/data').map(i=>return i);
items.forEach(i=>i.forEach(e=>(console.log(e.name))));

输出：test1，test2，test3。一切正常。

但是当我这样做时：

console.log(items.first());

我得到了一个 FirebaseListObservable。

我怎样才能从 FirebaseListObservable 中只获取第一个对象？ 如何编辑列表中的项目？喜欢：

items[0].name=test3

我如何从项目中获取 Firebase 密钥

如何从列表中的项目中获取 firebaseKey？

【参考方案1】：

Observables 是一个异步数据结构，这意味着您实际上并不知道数据何时可用，您必须订阅Observable 并等待@987654323 中的数据可用@处理程序。

items.first().subscribe(x => console.log(x.name));

此外，Observable 不是静态的，因此您无法将其编入索引。如果您只需要第一项，那么我建议您提取该值并使用 flatMap + first + map 组合对其进行修改。

af.database.list('/data')
  //Convert array into Observable and flatten it
  .flatMap(list => list)
  //Get only the first item in this list
  .first()
  //Transform the value
  .map((name, firebaseKey) => (name: "test3", firebaseKey))
  //Subscribe to the stream
  .subscribe(x => console.log(x));

【讨论】：

谢谢你，这对我很有帮助。

如果你想循环遍历项目，而不仅仅是第一个？

@Lloyd 那么您将使用flatMap 而不是first

你有 flatMap 在那里。所以就先把 first() 拿出来？

是的，在这种情况下只需删除first