2

I want to get the value of an observable, and return it from a synchronous function.

If the code was in html, I could use {{singleEvents$ | async}} .

I don't know of something similar in TS.

I know it's possible to subscribe for an observable to get it's values, but this is still asynchronous. I want the next line of code to only execute after I got a (single) value from the observable, and for the flow to continue synchronously afterwards.

Thanks,

P.S The reason I want this is that Im running different flows of the code depending on the result. I'd need to make everything asynchronous otherwise.

Edit: this is how the code looks like -

function ReturnVal() { let obs : Observable<boolean> = getFromHttp(); return ... unsure what to write here ...; } function DoStuff () { ... lots of logic ... if ReturnVal() { return; } ... lots of logic ... } 
2
  • An observable is always async (and is good). You can put all the code under the function subscribe or use rxjs operators if you need return another observable or unsubscribe automatically using takeWhile and ngOnDestroy or equal your subscription to a variable and unsubscribe Commented Jul 25, 2022 at 15:09
  • @Eliseo so you are saying this is completely impossible? and i have to put all the code in the second ... lots of logic ... inside a pipe / subscribe? this feels cumbersome, and if DoStuff would have returned a value it would have been even worst. Are you sure this is the only solution? Commented Jul 25, 2022 at 15:29

2 Answers 2

1

You can use pipe operators.

ngOnInit() { singleEvents$.pipe( take(1), // this ensures only one event fires and automatically unsubscribes after code runs // tap(console.log) // for debugging ).subscribe((singleEvents: ISingleEvent[]) => { // do something with singleEvents }) } 

Edit

One way to do something similar to your example

returnVal$(): Observable<boolean> { let obs : Observable<boolean> = getFromHttp(); return obs } doStuff () { ... lots of logic ... this.returnVal$().pipe( take(1), ).subscribe(returnVal => { if (returnVal) { return; } ... lots of logic ... }) } 
Sign up to request clarification or add additional context in comments.

6 Comments

subscribe wouldn't wait for the observable, right?
the function inside the subscribe runs everytime the observable event fires but take(1) ensures only one event fires. So yes and no. Yes the function inside subscribe will "wait" but other code inside ngOnInit but outside subscribe will not wait. This is a feature, not a bug
So i don't think this helps me (see the code example i added )
If this is the best solution I accept it. But Im disappointed angular is't more versatile. Think how much clatter this would have added if doStuff would have also returned a value. Even as is, it's inconvenient to say the least.
@NimrodFiat No offense, IMHO what you wanted to achieve, is not that easily possible in another framework/library. Please don't blame Angular(or any other FW), here the question was about handling async requests(callback driven) synchronously without changing things.
|
1

You can not simply write some synchronous function to return a value of some observable. The correct answer to your question depends on the situation, but I would suggest looking into withLatestFrom, combineLatest, or simply subscribing with take(1). Either way your code will be reacting to an observable, it will be asynchronous.

You can use lastValueFrom or firstValueFrom and await those, but read the documentation to know what to expect either when the observable does not complete or when the observable is a ReplaySubject

1 Comment

I tried using firstValueFrom, with await, but my compiler still said the function is async . I thunbed up the answer because it's relevant, but Im not sure how to use firstValueFrom.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.