title: Angular RXJS Sequential multiple post request
body: <p>I tried to do following function with concat map. but i'm not sure what is the correct way for that.</p>
  <pre><code>//Req 01
  await this.shippingInfoService.getShipmentInfoByCardId(this.data.CardId).then(async (shipmentData) =&gt; {
        if (shipmentData != undefined) {
          if (shipmentData.ShipmentId !== null &amp;&amp; shipmentData.ShipmentId !== &quot;&quot;) {
            //If shipment is assigned
            let shipmentId = shipmentData.ShipmentId;
            let contract = JSON.parse(sessionStorage.getItem(SITE_DETAILS_KEY)).Contract;
  
            let printObj = {
              &quot;ShipmentId&quot;: Number(shipmentId),
              &quot;Contract&quot;: contract
            }
  
  //Second Req
            await this.orderDetailsService.printBillOfLading(printObj).then(async () =&gt; {
              await this.orderDetailsService.getBillOfLeadingPdfInfo(shipmentId).then(async (response) =&gt; {
                if (response.ResultKey === null || response.Id === null) {
                  const dialogConfig = new MatDialogConfig();
                  dialogConfig.data = &quot;The information needed to generate a report isn't available.&quot;;
                  dialogConfig.disableClose = true;
                  this.dialog.open(ErrorDialogComponent, dialogConfig);
                  //Hide Loading indicator
                  this.store.dispatch(setLoadingSpinner({showLoading: false}));
                } else {
  // 3rd Req
                  let url = await this.orderDetailsService.generateBillOfLadingPdfUrl(response.ResultKey, response.Id);
                  await window.open(url.url, &quot;_blank&quot;);
                  //Hide Loading indicator
                  await this.store.dispatch(setLoadingSpinner({showLoading: false}));
                }
              });
            });
          } else {
            //If shipment is not assigned
            //Hide Loading indicator
            this.store.dispatch(setLoadingSpinner({showLoading: false}));
            //Error
            const dialogConfig = new MatDialogConfig();
            dialogConfig.data = &quot;Shipment needs to be connected&quot;;
            dialogConfig.disableClose = true;
            this.dialog.open(ErrorDialogComponent, dialogConfig);
          }
        }
      })
  </code></pre>
  <ol>
  <li>Request 02 is depend on Request 01</li>
  <li>Request 03 is depend on Request 02</li>
  </ol>
  <p>Need to refactor above code with rxjs operators.</p>