对数组的每个项目进行api调用

时间:2019-05-28 20:16:24

标签: javascript ajax angular angular-services angular-httpclient

我有一个天对象数组,我想为每个数组项进行单独的HTTP调用。但条件是当我获得上一个项目成功响应时,只有我想发出下一个项目API请求,直到我想等待。假设我数组中有5个项目,那么它将立即进行API调用。我希望每个项目API请求顺序。表示当我的第一项API请求响应为true时,则应调用第二项API。

我在每个循环中使用了for&并遍历每个数组项并进行HTTP调用,但它不等待先前的请求成功响应。

// component call

daysArr = [
    {
      day: 'Monday',
      date: '20-10-2018'
    },
    {
      day: 'Tuesday',
      date: '21-10-2018'
    },
    {
      day: 'Wednesday',
      date: '22-10-2018'
    },
    {
      day: 'Thursday',
      date: '23-10-2018'
    },
    {
      day: 'Friday',
      date: '24-10-2018'
    },
    {
      day: 'Saturday',
      date: '25-10-2018'
    },
    {
      day: 'Sunday',
      date: '26-10-2018'
    }
  ]
  
  postCall() {
  let apiUrl = 'https:someurl.com/api/dayspost';
  for (let i = 0; i < this.daysArr.length; i++) {
  
      // how to check previous request response & make request for next array element
      
    this.service.createPost(apiUrl,this.daysArr[i])
    .subscribe(response => {
      console.log('response',response)
    })
  }
}

//service post call

createPost(url, post) {
   return this.http.post(url,post)
    .pipe(
      map(data => {
        return data;
      })
     )
 }

上面的

是显示API请求的代码段。但是我不明白如何检查以前的响应,然后仅对新的数组元素进行新的API /后调用。

谢谢。

1 个答案:

答案 0 :(得分:0)

您可以执行以下操作:

let i = 0;
makeRequest(apiUrl, this.daysArr[i]){
  this.service.createPost(apiUrl,post)
    .subscribe(response => {
       console.log('response',response)
       i++;
       if(i < this.days.length){
          makeRequest(apiUrl, this.daysArr[i])
       }
  })
}

我目前没有IDE可以尝试此操作,但是应该可以正常工作