javascript - 处理管道和订阅 firebase Query 对象的类似方法是什么?

标签 javascript angular firebase firebase-realtime-database

我在 Angular 中有一个服务,使用以下方法从 Firebase 获取数据:

getMatchesFiltered(matchId: string, filter: string, sortDirection: string, pageIndex: number, pageSize: number){
    return this.db.object('/matches');
  }

它返回一个 firebase Observable,我可以对其应用 pipesubscribe,例如,

this.dbService.getMatchesFiltered(matchId, filter, sortDirection, pageIndex, pageSize).pipe(
                    catchError(()=> of([])),
                    finalize(()=>this.loadingMatches.next(false))
                  )
                  .subscribe(matches => {
                    let results = [];
                    let json_data = matches;
                    for(var i in json_data){
                      if(json_data[i].matchDeets){
                        results.push([i, json_data[i].matchDeets][1]);
                      }
                    }
                    this.matchesSubject.next(results);
                  });

但是,当我尝试从数据库服务返回一个 Query 时,返回的对象不再是一个 Observable:

getMatchesFiltered(matchId: string, filter: string, sortDirection: string, pageIndex: number, pageSize: number){
    let ref = firebase.database().ref("/matches");
    return ref.limitToFirst(pageSize);
  }

ERROR in src/app/matchDataSource.model.ts(29,106): error TS2339: Property 'pipe' does not exist on type 'Query'

关于如何以类似于 observable 的方式处理查询的文档似乎不是很及时。

例如,我可以在收到 DataSnapshot 后做一些事情:

ref.orderByKey().endAt("pterodactyl").on("child_added", function(snapshot) {
  console.log(snapshot.key);
});

但这是否意味着我必须在我的组件中添加 .on("child_added", function(snapshot) {}); 部分,而不是将其很好地包装在服务中?

所以,我想我有以下问题:

  1. 我不知道如何正确地划分/封装它。

  2. 如果我必须求助于 component.ts 文件,我不知道如何处理管道命令正在执行的操作。

  3. 我不知道我是否遗漏了一些非常简单直接的方法来使查询的行为类似于 Observable。

如果需要,很乐意提供来自 github 的工作示例。

最佳答案

是否可以将其放入 Observable 中:

Observable.create(function(observer) {
    ref.orderByKey().endAt("pterodactyl").on("child_added", snapshot => 
    {
        observer.next(snapshot.key);
    });
};

关于javascript - 处理管道和订阅 firebase Query 对象的类似方法是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50770409/

相关文章:

javascript - 如何自定义Blueimp jQuery文件上传的上传/下载模板

angular - 无法从 objectobservable 中获取对象名称

angular - @use 即将推出,但此版本的 Dart Sass 不支持

Android/Firebase - 在 GCM 事件中解析时间戳时出错 - 时间戳为空

Firebase 云消息传递与 Postman : Connection error as soon as I add authorization

javascript - 用字符串中包含的一些 HTML 替换 HTML 元素

javascript - 如何降低每次点击的不透明度

Angular 和 Tomcat 网址

android - 如何以编程方式获取 Firebase 中的注册用户列表

javascript - JavaScript 对象中的范围问题