Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

rxjs5 toPromise not working

In the following example toPromise does not work:

https://jsfiddle.net/tossp/nmf9jg32/

My code:

function getPostData() {
    return fetch('https://jsonplaceholder.typicode.com/posts/1')
    .then(res => res.json())
}
var source = Rx.Observable.fromEvent(document.body, 'click');

var example = source.concatMap(
            e => Rx.Observable.from(getPostData()), 
            (e, res, eIndex, resIndex) => res.title);

example.subscribe({
    next: (value) => { console.log('subscribe!!!',value); },
    error: (err) => { console.log('Error: ' + err); },
    complete: () => { console.log('complete'); }
});
example.do((value)=>console.log('do!!!',value)).toPromise().then((value)=>console.log('toPromise!!!',value));
like image 810
TossPig Avatar asked Apr 10 '17 01:04

TossPig


People also ask

Why is toPromise deprecated?

As mentioned here, these are the main reasons why toPromise is being deprecated: One goal was to remove it from the Observable prototype and turn it into a standalone util function. The naming of toPromise is not the best. Especially when used in combination with await it does not read very well: await categories$.

How do you use toPromise?

toPromise method is Promise object. In order to use async/await style, you need at first wrap your code with async function, by prepending async keyword to function, and then with await keyword tell your code to wait for async operation. In your case it's http request.

Does toPromise subscribe?

The toPromise function lives on the prototype of Observable and is a util method that is used to convert an Observable into a Promise . Inside this function we subscribe to the Observable and resolve the Promise with the last emitted value - attention - when the Observable completes!

How do you turn an Observable into a Promise?

How to Convert an Observable to a Promise in Angular? Since the get method of HttpClient returns an observable, we use the toPromise() method to convert the observable to a promise. Since you can convert an observable to a promise, you can make use of the async/await syntax in your Angular code.

How to get rid of topromise in RxJS?

In RxJS 7 toPromise is deprecated and with RxJS 8 it will be removed. We need to start using lastValueFrom or firstValueFrom - which both returns a ` Promise `. Don't forget to import {...} from "rxjs". Lastly, avoid ` toPromise ` and start using ` lastValueFrom or firstValueFrom `.

Is topromise deprecated in angular / RxJS?

but toPromise () is deprecated in recent versions of angular / rxjs. /** @deprecated Replaced with {@link firstValueFrom} and {@link lastValueFrom}.

Why is topromise() not working with observables?

The naming of toPromise is not the best. The type information of toPromise is wrong. When the source Observable completed without ever emitting a single value - it resolved with undefined. It should reject in that case. A Promise is a "promise" that when it resolves a value will be there - and be it undefined.

Can I use topromise() inside the pipe function?

It can't be used within the pipe function. The toPromise function lives on the prototype of Observable and is a util method that is used to convert an Observable into a Promise. Inside this function we subscribe to the Observable and resolve the Promise with the last emitted value - attention - when the Observable completes!


2 Answers

Already solved https://github.com/ReactiveX/rxjs/issues/2536

toPromise is essentially observable.last().subscribe()

If you add .take(1) just before you call toPromise then things will start to work.

ie

example.do((value)=>console.log('do!!!',value)).take(1).toPromise()
like image 144
TossPig Avatar answered Sep 20 '22 22:09

TossPig


In newer versions you must use take(1) inside pipe(). I did this kind of code:

async getPromise() {

    return await example
    .pipe(take(1))
    .toPromise();

  }

Hope it helps someone.

like image 34
Antti Tanskanen Avatar answered Sep 19 '22 22:09

Antti Tanskanen