How to wait in angular component while service is Fetching (with Http)and Manipulating that data and return

Question

I have component where I call service function

**xyz.component.ts**

let limitCrossed = this.outgoingPaymentsMultipleService.checkMultipleApproveLimit(selectedPayments);

    let param: DialogConfirmCallerConfig = {
      confirmationNeeded: **limitCrossed != null,** // I need to use return data here
      data: {limitFailed: {account:"user",duration:"payment"}}

    };

In service file xyz.service.ts

checkMultipleApproveLimit(payments){
    combineLatest([currencyConversion$, userPaymentsLimit$]).subscribe(([c, l]) => {
      
      const limitFailed = this.isPaymentsLimitCrossed(paymentsLimitsCheck, c, l)
      
      return limitFailed;

    })

    isPaymentsLimitCrossed(paymentsLimitsCheck, currencyConversionRates, limits){
    // some calculation and base on that returning object
    
    return {o : true };
    }

in component how to wait to use limitCrossed

Answer 1

From my perspective, your code isn't working correctly: you are returning a subscription from your service to your component, and you aren't subscribing to anything.

Service

checkMultipleApproveLimit(payments){
  return combineLatest([currencyConversion$, userPaymentsLimit$]).pipe(
    map(([c, l]) => this.isPaymentsLimitCrossed(paymentsLimitsCheck, c, l))
  );
}

Component

    let param: DialogConfirmCallerConfig; 
    
    this.outgoingPaymentsMultipleService.checkMultipleApproveLimit(selectedPayments)
    .subscribe(limitedCrossed => )
    
        param ={
          confirmationNeeded: !limitCrossed,
          data: {limitFailed: {account:"user",duration:"payment"}}
        };

To understand how Observables works refer to Angular observables overview