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

Question

我目前正在使用Angular 2和angularFire2开发一个项目。 我的Firebase数据库看起来是这样的: base:/data

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

所有项目都拥有Firebase密钥。

现在我正在尝试使用RX中的Observables从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密钥？

- jufabeck2202

Answer 1

观察者模式是一种异步数据结构，这意味着您实际上不知道数据何时可用，您必须订阅Observable并等待数据在next处理程序中变为可用。

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));

- paulpdaniels

---

谢谢，那真的帮了我很多。 - jufabeck2202

如果您想循环遍历所有项目，而不仅仅是第一个，该怎么办？ - Lloyd

@Lloyd，那么你应该使用flatMap而不是first。 - paulpdaniels

你在那里使用了flatMap。所以只需要把first()拿出来？ - Lloyd

是的，在这种情况下只需删除“first”即可。 - paulpdaniels

我使用了 af.list('/data').subscribe(x => console.log(x));，并将所有数据加载到应用程序组件中。 - Ian Poston Framer