Angular 2: Convert Observable to Promise

Q) How do I convert the following observable to a promise so I can call it with .then(...)?

My method I want to convert to a promise:

  this._APIService.getAssetTypes().subscribe(
    assettypes => {
        this._LocalStorageService.setAssetTypes(assettypes);
    },
    err => {
        this._LogService.error(JSON.stringify(err))
    },
    () => {}
  ); 

The service method it calls:

  getAssetTypes() {
    var method = "assettype";
    var url = this.apiBaseUrl + method;

    return this._http.get(url, {})
      .map(res => <AssetType[]>res.json())
      .map((assettypes) => {
        assettypes.forEach((assettypes) => {
          // do anything here you might need....
      });
      return assettypes;
    });      
  }  

Thanks!

5
Leave a Reply

avatar
5 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

rxjs6

https://github.com/ReactiveX/rxjs/issues/2868#issuecomment-360633707

Don’t pipe. It’s on the Observable object by default.

Observable.of('foo').toPromise(); // this

rxjs5

import 'rxjs/add/operator/toPromise';
import 'rxjs/add/operator/map';

...

this._APIService.getAssetTypes()
.map(assettypes => {
  this._LocalStorageService.setAssetTypes(assettypes);
})
.toPromise()
.catch(err => {
  this._LogService.error(JSON.stringify(err));
});

Jason
Guest

observable can be converted to promise like this:

let promise=observable.toPromise();

Jason
Guest

you dont really need to do this just do …

import 'rxjs/add/operator/first';


this.esQueryService.getDocuments$.first().subscribe(() => {
        event.enableButtonsCallback();
      },
      (err: any) => console.error(err)
    );
    this.getDocuments(query, false);

first() ensures the subscribe block is only called once (after which it will be as if you never subscribed), exactly the same as a promises then()

Jason
Guest

The proper way to make Observable a Promise, in your case would be following

getAssetTypesPromise() Observable<any> {
  return new Promise((resolve, reject) => {
      this.getAssetTypes().subscribe((response: any) => {
        resolve(response);
      }, reject);
    });
}
Jason
Guest

A lot of comments are claiming toPromise deprecated but as you can see here it’s not. So please juste use toPromise (RxJs 6) as said: //return basic observable const sample = val => Rx.Observable.of(val).delay(5000); //convert basic observable to promise const example = sample('First Example') .toPromise() //output: 'First Example' .then(result => { console.log('From Promise:', result); }); async/await example: //return basic observable const sample = val => Rx.Observable.of(val).delay(5000); //convert basic observable to promise const example = await sample('First Example').toPromise() // output: 'First Example' console.log('From Promise:', result); Read more here. And please remove this wrong claim saying toPromise is deprecated. Note: Otherwise you… Read more »