将多个可观察数组合并为新的对象数组 [英] Combine multiple observable arrays into new object array

问题描述

我有3个可观察的数组，如下所示.

I have 3 observable arrays like below.

persons = [
   {
      "firstName":"john",
      "lastName":"public",
      "locationID":"1",
      "departmentID":"100"
   },
   {
      "firstName":"sam",
      "lastName":"smith",
      "locationID":"2",
      "departmentID":"101"
   }
]

departments = [{"departmentID": "100",
               "name": "development"
               },
               {"departmentID": "101",
                "name": "sales"
               }]

locations = [{"locationID": "1", "name": "chicago"},
              {"locationID":"2", "name": "ny"}]

我正在尝试将这3个结果合并为以下结果，

I am trying to combine these 3 into below result ,

result = [
   {
      "firstName":"john",
      "lastName":"public",
      "location":"development",
      "department":"sales"
   },
   {
      "firstName":"sam",
      "lastName":"smith",
      "location":"ny",
      "department":"sales"
   }
]

为了获得理想的结果，我在可观察到的人身上使用了map函数来给出新的对象数组.

To get the desired result, I have used map function on persons observable to give new object array.

this.store<Person>('persons')
.map(function(person){
     let p = new personDetail()
     p.firstName = person.firstName,
     p.lastName = person.lastName
     return p;
})

PersonDetail对象具有firstName，lastName，location和department属性.如何对可观察的部门进行查找并为departmentID获取匹配行以获取部门名称?

PersonDetail object has firstName, lastName, location and department properties. How do I do a lookup into departments observable and get a matching row for departmentID to get the department name ?

我是rxjs库的新手，请告诉我是否有更好的方法来获得所需的结果.

I am new to rxjs library, please let me know if there is a better way to attain the desired result.

推荐答案

由于您很可能想从远程服务中获取部门和位置的列表(发出另一个HTTP请求)，因此我将立即使用Observables进行操作也是

Since you'll very likely want to fetch lists of departments and locations from a remote service (make another HTTP request) I'd do it right away with Observables as well.

Observable.from(persons)
    .mergeMap(person => {
        let department$ = Observable.from(departments)
            .filter(department => department.departmentID == person.departmentID);

        let location$ = Observable.from(locations)
            .filter(location => location.locationID == person.locationID);

        return Observable.forkJoin(department$, location$, (department, location) => {
            return {
                'firstName': person.firstName,
                'lastName': person.lastName,
                'location': location.name,
                'department': department.name,
            };
        });
    })
    .toArray()
    .subscribe(result => console.log(result));

这将打印到控制台:

[ { firstName: 'john',
    lastName: 'public',
    location: 'chicago',
    department: 'development' },
  { firstName: 'sam',
    lastName: 'smith',
    location: 'ny',
    department: 'sales' } ]

有两个Observables department$和location$用filter()运算符过滤，以获取唯一具有匹配ID的项目.然后 forkJoin() 操作员等待，直到两个都完成.然后，运算符mergeMap()会重新发出从forkJoin()返回的值.在toArray()最后，我们将所有项目收集到一个数组中.

There're two Observables department$ and location$ that are filtered with filter() operator to get the only item with matching ID. Then forkJoin() operator waits until both of them are complete. Operator mergeMap() then reemits the value returned from forkJoin(). At the end with toArray() we collect all items into a single array.

您可以使用所需的任何服务(例如http.get(...))来代替Observable.from(...).

Instead of Observable.from(...) you can have whatever service you'll need (eg. http.get(...)).

观看现场演示: https://jsbin.com/nenekup/4/edit ?js，控制台

类似的问题:使用Observables合并子数组和 查看全文