使用管道运算符内的RXJS进行多个HTTP调用

时间:2018-12-09 06:34:56

标签: angular rxjs httpclient

我有3个API端点(候选人,职位空缺和面试)。

{
    "candidates": [
        {
           "id": 1,
           "name": "Serj"
        },
        {
           "id": 2,
           "name": "Alex"
        },
      ],
    "vacancies": [
        {
           "id": 1,
           "title": "Java"
        },
        {
           "id": 2,
           "title": "JS"
        },
      ],
   "interviews": [
        {
           "id": 1,
           "candidateId": 1,
           "vacancyId": 2,
           "date": "2018-12-11"
        },
        {
           "id": 2,
           "candidateId": 2,
           "vacancyId": 1,
           "date": "2018-12-11"
        },
      ]
}

我首先按日期进行采访,并进行一系列采访。

const params = new HttpParams().set('date', '2018-12-11');
this.http.get('http://localhost:3000/interviews', {params}).pipe();

当我subscribe()pipe()的输出时,我想得到一系列访谈,其中实际的对象是"candidateId",而不是"vacancyId"candidatevacancy从适当的端点获取。

所以结果(Interview[])应该像这样:

[
  {
    "id": 1,
    "candidate": {
      "id": 1,
      "name": "Serj"
    },
    "vacancy": {
      // vacancy instance
    },
    "date": "2018-12-11"
  },
  // second interview object
]

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

如果我理解正确的话,您希望将您的采访回复过滤掉,以包含仅包含候选人编号和vacancyId字段的对象数组吗?

如果是这种情况,则可以使用以下方法:

this.http.get('http://localhost:3000/interviews', {params})
  .pipe(
     flatMap(item => item),
     map(({ candidates, vacancies, interviews}) => 
        interviews.map(({ id, candidateId, vacancyId, date }) => ({ 
           id,
           candidate: candidates.filter(c => c.id === candidateId)[0], 
           vacancy: vacancies.filter(v => v.id === vacancyId)[0],
           date
        })
     )),
     reduce((acc, val) => [acc, val])  
  )
  .subscribe(response => console.log(response));

已经创建了一个Stackblitz Demo供您参考。