加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

尝试在Angular 2项目中将多个observable合并为一个

发布时间:2020-12-17 17:42:15 所属栏目:安全 来源:网络整理
导读:我试图了解RxJs中的Observables.我有一个页面,我需要显示特定网站的所有用户. User和SiteUser实体位于不同的API端点中.我有以下端点 userService.getSiteUsers(siteId: string): ObservableSiteUser[]; 哪里 export class SiteUser { site_id: string; user_
我试图了解RxJs中的Observables.我有一个页面,我需要显示特定网站的所有用户. User和SiteUser实体位于不同的API端点中.我有以下端点

userService.getSiteUsers(siteId: string): Observable<SiteUser[]>;

哪里

export class SiteUser {
    site_id: string;
    user_id: string;
}

userService.getUser(user_id: string): Observable<User>;

哪里

export class User {
    id: string;
    name: string;
    email: string;
    ....
}

所以我必须做以下事情:

>调用siteUsers API以获取特定站点的所有用户ID
>对于每个用户id,请进行getUser API调用以获取用户详细信息

我可以轻松地做到这一点

let users: User[] = []; // this is bound in html view to a table
this.userService.getSiteUsers("my site id")
                .subscribe((siteUsers) => {
                    for (let siteUser of siteUsers) {
                        this.userService.getUser(siteUser.user_id)
                                        .subscribe((user) => {
                                            users.push(user);
                                        });
                    }
                });

但这种方法感觉很脏或很麻烦.我确信有一种更清晰的Observable方法.我是Observables的新手,但据我所知,我应该可以做这样的事情(不是selectMany和mergeAll函数只是我的猜测,我尝试过它并没有用,我甚至找不到selectMany在rxjs库))

获取站点用户可观察数组 – >对于可观察数组中的每个元素,创建用户可观察 – >将它们全部合并到可观察的用户数组中 – >订阅,所以像这样:

this.userService.getSiteUsers("my site id") 
                .selectMany((siteUser) => this.userService.getUser(user))
                .mergeAll()
                .subscribe((users) => {
                    this.users = users; 
                });

有人可以帮助,我不能让它工作

编辑 – – –

也许这样的事情

this.userService.getSiteUsers("my site id")
    .switchMap(
       (siteUsers) => {
         let userQueries: Observable<User>[] = [];
         for (let siteUser of siteUsers) {
            userQueries.push(this.userService.getUser(siteUser.user_id));
         }

         return Observable.forkJoin(userQueries);
       }
    )
    .subscribe((users) => {
        this.users = users;
    });

解决方法

如果一个http调用依赖于另一个http调用,则应使用.flatMap()/ .mergeMap()运算符.

例如在你的情况下这样的事情会做,

this.userService.getSiteUsers("my site id")
.switchMap(
   (siteUsers) => {
     let userQueries: Observable<User>[] = [];
     for (let siteUser of siteUsers) {
        userQueries.push(this.userService.getUser(siteUser.user_id));
     }

     return Observable.forkJoin(userQueries);
   }
)
.subscribe((users) => {
    this.users = users;
});

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读