Return promise value from observable subsciption

Question

Is there any chance to return from helpMe function value from getDataFromApi() ? So far every time i call this function i get "null" value.

       async function helpMe() {
            let promise = null;
            let sub = someService.someObservable.subscribe(async () => {
               promise = await getDataFromApi()
            })
            subscriptions.push(sub)
            return promise;
        }

The first goal is i need to store subscription in global sub array. The second goal is when i get response with status 400 - I dont want to open modal. Only when i get 200 and everything is allright i want modal to be opened.

function async load() {
  const promise = await helpMe();
  openModal();
}

I might be blind here, but why do you need the observable here? Can't you just do `let promise = await getDataFromApi()` — Sentinel, Jul 01 '19 at 11:47
Besides, as far as I remember, `await` does not work over a `subscribe` result, since it returns an Observable which can't be "awaited". You should rather convert the observable to a `Promise` if you want to `await` it (hence promise being null) — briosheje, Jul 01 '19 at 11:48
How often does `subscribe` trigger the callback? If multiple times, it makes no sense to use promises anyway. — Bergi, Jul 01 '19 at 12:03
I need to store this subscription in global subscriptions array for futher actions in other service. — wantToBeAProgrammer, Jul 01 '19 at 12:16
you are pushing the promise into your subscriptions though, not the sub, in the line before the return. — Sentinel, Jul 01 '19 at 12:39

score 2 · Answer 1 · answered Jul 01 '19 at 12:09

Passing an async function to subscribe is pointless - it throws away the returned promise, it doesn't wait for anything. You would need to use

new Promise((resolve, reject) => {
    someService.someObservable.subscribe(resolve, reject);
})

or just call the builtin toPromise method:

async function helpMe() {
    await someService.someObservable.toPromise();
    return getDataFromApi();
}

cyr_x · Answer 2 · 2019-07-01T13:34:46.597

1

Instead of using async/await feature, you could just go with plain rxjs. The switchmap operator might help you here:

public helpMe()
{
  return this.someService.someObservable.pipe(
    switchMap(result =>
    {
      return someDataFromApi();
    }),
    tap(resultFromApi => {
      // ... do something with `resultFromApi` from `someDataFromApi`.
    }),
  ).toPromise();
}

edited Jul 01 '19 at 13:34

answered Jul 01 '19 at 12:16

cyr_x

13,987
2
32
46

score 0 · Answer 3 · answered Jul 31 '23 at 11:08

We will use Promise to return the subscribed Observabal value in the following way

const getUser = () => new Promise((resolve, reject) => {
    return UserInfoService().subscribe({
        err: err => reject(err),
        next: res => resolve(UpdateUserInfo(res)),
    })
})

Return promise value from observable subsciption

3 Answers3

Linked