chain promise in sequential way

Question

i know that this problem has been studied a thousand times, but i tried plenty of solutions, it still not works.

I want to chain promises from http get, but i need to wait for the previous before running the next one, because the get method returns me a number which is pushed in an array, and it needs to be ordered correctly.

What i have tried : put every promise in an array and then use reduce method, but it didn't work. I think the tricky thing is that i have condition of one of the params of my get whose value changes. these values are in an array so i tried to perform a forEach with an await but it didn't work.

So here is my current code :

async getAEObservable(checkIn: Date, checkOut: Date, adults: number, HotelID) {
    var In = checkIn;
    var Out =checkOut;


    var  promises=[];

    var id = []
    HotelID.forEach(element =>
      id.push(element))

    var index=0
    var ind = HotelID[0]
    if (HotelID.length !== 0) {
    if (ind !== "NULLNULL") {
      console.log('ok')
      const httpOptions = {
        headers: new HttpHeaders({
          'Content-Type': 'application/json',
          'Ama-Pos': '{"agentSine": "A9998WS","agentUserID": "AA","agentDutyCode": "GS","agencyDetails":{"currencyCode": "EUR","identifiers": [{"type": "IATA","id": "QIJI12151"}],"address":{"cityCode": "NCE","countryCode": "FR"}}}'
        })
      };

        let checkIn_param = this.transformDate(checkIn);
        let checkOut_param = this.transformDate(checkOut);
        let apiUrl = `${this.apiRoot_v0}?hotelIds=${ind.toString()}&checkInDate=${checkIn_param}&checkOutDate=${checkOut_param}&roomQuantity=1&adults=2&radius=5&radiusUnit=KM&rateCodes=RAC&paymentPolicy=NONE&includeClosed=true&bestRateOnly=true&view=FULL&sort=NONE`
        let url = `${apiUrl}`;
        console.log(url)
        return await this.apiCall(url, httpOptions, checkIn, checkOut, adults, HotelID); // here we are calling a function which contain a api call inside this function we are resolving the promise
      } else {

        // here we are not creating a promise bcs here we have simple push operation

        this.resAE.price.push(0)
        this.getAEObservable(checkIn, checkOut, adults, HotelID.slice(1));
        return this.resAE
      }
    }
    else {return this.resAE}
      }










async apiCall(url, httpOptions,checkIn, checkOut, adults, HotelID) {
   await new Promise(async (resolve, reject) => {
    await this.httpClient.get<any>(url, httpOptions).toPromise().then(result => {
      console.log(result)
      var price = result['data']['0']['offers']['0']['price']['total'];

      console.log(price)

      this.resAE.price.push(price);
      console.log(this.resAE)


  return this.resAE
    }).then(async resp => { if (HotelID.length !=0){
       this.getAEObservable(checkIn, checkOut, adults, HotelID.slice(1));}
      else{
      resolve();}
    }).catch(this.handleError)

  })

}






async apiCall(url, httpOptions,checkIn, checkOut, adults, HotelID) {
  return await new Promise(async (resolve, reject) => {
    this.httpClient.get<any>(url, httpOptions).toPromise().then(result => {
      console.log(result)
      var price = result['data']['0']['offers']['0']['price']['total'];

      console.log(price)

      this.resAE.price.push(price);
      console.log(this.resAE)

      return this.resAE;
    }).then(resp => { if (HotelID.length ===0){

      return this.resAE

    } else {
      this.getAEObservable(checkIn, checkOut, adults, HotelID.slice(1));
      resolve()};
    }).catch(this.handleError)
  })
}

The ides is to perform the first get, fill my array, and when is it finished, proceed to the next get call, by calling the function itself, but by removing the first element of HotelID, i used for the previous get.

The array is filled, so there is no problem other that is it not well i think...

I just edit my question to say that the console.log(url) shows me that the url are created in the good order

score 0 · Accepted Answer · answered May 28 '19 at 10:15

you can try like this.

async getAEObservable(checkIn: Date, checkOut: Date, adults: number, HotelID) {
 console.log(HotelID);
    var In = checkIn;
    var Out =checkOut;

    var  promises=[];

    var id = []
    HotelID.forEach(element =>
    id.push(element))
    console.log(id)
    var index=0
    var ind = HotelID[0]
      if (ind !== "NULLNULL") {
        console.log('ok')
        const httpOptions = {
          headers: new HttpHeaders({
            'Content-Type': 'application/json',
            'Ama-Pos': '{"agentSine": "A9998WS","agentUserID": "AA","agentDutyCode": "GS","agencyDetails":{"currencyCode": "EUR","identifiers": [{"type": "IATA","id": "QIJI12151"}],"address":{"cityCode": "NCE","countryCode": "FR"}}}'
          })
        };

        let checkIn_param = this.transformDate(checkIn);
        let checkOut_param = this.transformDate(checkOut);
        let apiUrl = `${this.apiRoot_v0}?hotelIds=${ind.toString()}&checkInDate=${checkIn_param}&checkOutDate=${checkOut_param}&roomQuantity=1&adults=2&radius=5&radiusUnit=KM&rateCodes=RAC&paymentPolicy=NONE&includeClosed=true&bestRateOnly=true&view=FULL&sort=NONE`
        let url = `${apiUrl}`;
        console.log(url)
        return await apiCall(url, httpOptions); // here we are calling a function which contain a api call inside this function we are resolving the promise
      } else {

        // here we are not creating a promise bcs here we have simple push operation

        this.resAE.price.push(0)
        this.getAEObservable(checkIn, checkOut, adults, HotelID.slice(1));
        return this.resAE
      }

here is the api call function

apiCall(url, httpOptions) {
 return new Promise((resolve, reject) => {
this.httpClient.get<any>(url, httpOptions).toPromise().then(res => {
            console.log(res)
            var price = res.data[0].offers[0].price.total;
            console.log(price)
            this.resAE.price.push( price);
            console.log(this.resAE)
            console.log(id)
            console.log(id.slice(1))
            return this.resAE;
          }).then( resp => {
             this.getAEObservable(checkIn, checkOut, adults, HotelID.slice(1))
             resolve();
         }).catch(this.handleError)
})
}

Comments are not for extended discussion or debugging sessions; this conversation has been [moved to chat](https://chat.stackoverflow.com/rooms/194067/discussion-on-answer-by-yash-rami-chain-promise-in-sequential-way). Please be sure to [edit] the answer to include any relevant information from the discussion. — Cody Gray - on strike, May 28 '19 at 17:26
Watch out for [Explicit Construction](https://stackoverflow.com/questions/23803743/what-is-the-explicit-promise-construction-antipattern-and-how-do-i-avoid-it) — Benjamin Gruenbaum, May 28 '19 at 17:36

chain promise in sequential way

1 Answers1