代码之家 › 专栏 › 技术社区 › Áxel Costas Pena

如何在创建时获得一个实时的firebase结果?

observable firebase-realtime-database firebase angular javascript

-1

Áxel Costas Pena · 技术社区 · 7 年前

我正在开发一个基于iionic 3-firebase的聊天应用程序,使用firebase实时数据库存储消息,将它们加载到应用程序中并立即显示。

当聊天对话打开时,我使用下一个受限查询加载消息,因此在输入后,我只会加载最后100条消息:

this.messagesRef = this.afDB.list(
    `/messages/${this.me.uid}/conversations/${this.contact.uid}/messages`, ref =>  
   .limitToLast(100)).valueChanges();

它返回一个可观察的集合,我可以直接将其绑定到角度模板,因此当新消息到达,甚至其他用户删除一条消息时,聊天会很好地更新。

但是这个实现有两个严重的问题:每次我发送或接收消息时,最后一个显示的消息都会隐藏,因为它超出了100的限制。另外,我无法实现无限滚动来加载以前的消息,因为我无法找到实现的方法。

当新消息到达时,哪种解决方案可以使限制范围相应增长?在这种情况下,如何实现以前的消息加载?

1 回复 | 直到 7 年前

1

0

Frank van Puffelen 7 年前

现在你有你的 messagesRef 设置为最近100条消息的列表。因此,如果添加了新消息,则删除最旧的消息。这是按预期进行的。

听起来你想要一个不同的行为:从100条最近的消息开始,然后添加任何新的消息进来。为此,您需要删除 limitToLast 从你的询问中。为了确保您仍然以(最多)100条消息开始,您需要添加一个不同的条件:告诉查询从特定消息开始。

步骤如下:

在N-100位置找到信息
在那条消息上开始查询

在代码中,这应该类似于:

ref.orderByKey().limitToLast(100).once('child_added', function(snapshot) {
  var oldestKey = snapshot.key;
  this.messagesRef = this.afDB.list(
    `/messages/${this.me.uid}/conversations/${this.contact.uid}/messages`, ref =>  
   ref.orderByKey().startAt(oldestKey)).valueChanges());
})