angular - 多个 Observable 订阅

标签 angular reactive-programming rxjs observable angularfire2

我需要多次订阅才能从我的 NoSQL 数据库中获取正确的数据。为了获取特定项目的用户列表,我这样做:

ngOnInit() {
    //Subscription 1 (Service): Get project data
    this.projectService.getCurrentproject().take(1).subscribe(projectData => {
        console.log('Got project data.');
        //Subscription 2: Get project user IDS
        this.af.database.list('/project_roles/'+projectData.$key)
            .subscribe((userMeta) => {
                });
            });
}
  • 如您所见,一个订阅,在一个订阅中,在一个订阅中。每个订阅都取决于前一个订阅的结果。

  • 订阅 3 和订阅 4 可以并行。

代码运行良好,但我是否遗漏了什么,或者这就是我假设使用多个订阅时前一个的结果取决于下一个的方式?

更新:订阅 #2 似乎有问题。订阅尚未完成,但我开始遍历列表,这给了我一个双用户列表!

最佳答案

试试这个。

ngOnInit() {
    this.projectService.getCurrentproject().take(1)
        .flatMap(projectData => {
            return this.af.database.list('/project_roles/'+projectData.$key)
        })
        .flatMap(userMeta => {
            let subs = userMeta.map(projectRole => {
                return Observable.zip([
                    this.af.database.object('/roles/'+projectRole.$value),
                    this.af.database.object('/users/'+projectRole.$key)
                ]).map(([roleData, user]) => {
                    user.role = roleData.$value;
                    return Observable.of(user)
                })
            });
            return Observable.zip(subs)
        })
        .subscribe(users => {
            this.users = users
        })
}

基本上我正在编写订阅以获得一个发出用户数组的可观察对象

关于angular - 多个 Observable 订阅,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40150982/

相关文章:

css - 在 Angular 2 中使用 Sass

angular - TypeScript 编译中缺少 in-memory-data.service.ts

java - 使用 RxAndroid 生成树排序结构

javascript - 如何在 Javascript 中实现 Haskell 的 FRP Behavior 类型?

javascript - rxjs: observable.complete 不是函数

c# - 在前一个元素匹配条件后获取流的第一个元素

Angular 7 + Angular Material 。如何切换扩展的垫菜单下拉菜单上的图标?

Angular2 - ngFor 中的 ngIf

javascript - rxjs 过滤器在 false 条件下不返回任何内容

javascript - switchMap 操作只在第一次调用时运行?