Rxjs 映射子对象加上父字段

Question

我收到来自 http get 的响应

{
    "parents": [{
        "id": 1
        , "children": [{
                "name": "child1"
            }
            , {
                "name": "child2"
            }]
    }, {
        "id": 2
        , "children": [{
                "name": "child1"
        }]
    }]
}

我有这个界面

export interface Child {
    parentId: string
    , name: string
}

问题

我应该做哪个映射来获取子数组（在订阅的响应中），其中包含父项的名称和 ID？

getChildren(): Observable<Child[]> {    
    return this.http
        .get(API_URL)
        .//map function;
}

或者至少，告诉我去哪里寻找某种答案

提前致谢。

Answer 1

您可以使用单个 map() 运算符，然后在其中使用 Array.forEach() 和 Array.map():

const Observable = Rx.Observable;

data = {
  "parents": [{
    "id": 1
    , "children": [{
      "name": "child1"
    }
      , {
        "name": "child2"
      }]
  }, {
    "id": 2
    , "children": [{
      "name": "child1"
    }]
  }]
};

Observable.of(data)
  .map(data => {
    let results = [];
    data['parents'].forEach(item => {
      results = results.concat(item['children'].map(child => {
        return {
          'parentId': item.id,
          'name': child.name,
        };
      }));
    });

    return results;
  })
  .subscribe(val => console.log(val));

这将打印以下内容（包含对象的数组作为单个发射）：

[ { parentId: 1, name: 'child1' },
  { parentId: 1, name: 'child2' },
  { parentId: 2, name: 'child1' } ]

Rxjs 映射子对象加上父字段

Rxjs map child objects plus parent field

rxjs

rxjs5

angular