Concat with if in angular (how to use sequential request with conditions )

Question

I have an event which call 3 http observable. order of these request is important to me. so I have to use concat from rxjs. for example with the first request I got the data and fill my local variable values with that, then I want to check if the result of one of those local variable is true then send next request.

Something like that:

onMyEvent(e) {
    let isRoundingAdditionIsRequiered = false;
    let ishavePeriodicalDiscount = false;

    const api = 'api/Sales/SaleTemplate/' + e;
    const firstApiGet = this.dataSourceService.generateCustomApiDataList(
      'sales',
      'SaleTemplate',
      api
    ).dataList$;
    const secondApi= 'api/Sales/Addition/List?$filter=AdditionCode eq "4"'
    const secondApiGet= this.dataSourceService.generateCustomApiDataList(
      'sales',
      'SaleTemplate',
      api
    ).dataList$;
    const postApi = 'api/Sales/Contract/CalculateAllRowPrices/';
    const calculatePrice = this.dataSourceService.generateCustomApiPost
        ('sales', 'Contract', postApi, this.entity).dataList$;
}

Now by the result of firstApiGet I want to set isRoundingAdditionIsRequiered to true. like this:

firstApiGet.subscribe(data => { if (data.RoundingAdditionIsRequiered) {isRoundingAdditionIsRequiered =true} });

then check it for next request:

if (isRoundingAdditionIsRequiered ) {
    secondApi.subscribe(data => {// codes here ...})
}
// and other codes ...

This is not work sequential so I have to use concat operator.

Something like

concat(firstApiGet,secondApiGet,postApi).subscribe(data=>{//...})

So what is the code?

You might want to try combineLatest or forkJoin instead of contact, your code should look like this combineLatest([firstApiGet, secondApiGet, postApi]).pipe(....).subscribe({ next: ([first, second, third]) => { if (data.RoundingAdditionIsRequiered) {isRoundingAdditionIsRequiered =true} }) — Bargros
– Bargros, Commented Mar 26, 2021 at 23:39

Riad Baghbanli · Accepted Answer · 2021-03-26 23:53:34Z

1

You can use switchMap operator.

onMyEvent(e) {
  let isRoundingAdditionIsRequiered = false;
  let ishavePeriodicalDiscount = false;
  const api = 'api/Sales/SaleTemplate/' + e;
  const firstApiGet = this.dataSourceService.generateCustomApiDataList(
       'sales', 'SaleTemplate', api ).dataList$;
  const secondApi= 'api/Sales/Addition/List?$filter=AdditionCode eq "4"'
  const secondApiGet= this.dataSourceService.generateCustomApiDataList(
       'sales', 'SaleTemplate', api ).dataList$;
  const postApi = 'api/Sales/Contract/CalculateAllRowPrices/';
  const calculatePrice= this.dataSourceService.generateCustomApiPost(
       'sales','Contract',postApi,this.entity).dataList$;
  }
  firstApiGet.pipe(
     switchMap( data => {
        isRoundingAdditionIsRequiered = data.RoundingAdditionIsRequiered;
        return isRoundingAdditionIsRequiered ? secondApiGet : of( undefined );
     ),
     switchMap( () => calculatePrice )
  ).subscribe();
}

edited Mar 26, 2021 at 23:53

answered Mar 26, 2021 at 23:40

Riad Baghbanli

3,3461 gold badge17 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Ali Eshghi Over a year ago

wow! I know by switch map we can unsubscribe from first request don't I?, so the order should work. let me try it then vote to your Idea

Ali Eshghi Over a year ago

dear @Raid I want to check if isRoundingAdditionIsRequiered ===true then secondApiGet send. by this even if isRoundingAdditionIsRequiered === false again secondApiGet will send.

Riad Baghbanli Over a year ago

What should happen if isRoundingAdditionIsRequiered === false?

Ali Eshghi Over a year ago

only firstApiGet and calculatePrice should be subscribed

Ali Eshghi Over a year ago

it seems a perfect Idea, let me try it. by the way you are awesome ;)

|

Collectives™ on Stack Overflow

Concat with if in angular (how to use sequential request with conditions )

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related