fromPromise does not exist on type Observable

In Angular 2 using rxjs I was trying to convert a Promise to Observable. As many of online guides showed I used fromPromise on Observable. Which throws error:

Property 'fromPromise' does not exist on type 'typeof Observable'.

Observable was imported like:

import { Observable } from "rxjs/Observable";

trying to import fromPromise like other operators results in error:

import 'rxjs/add/operator/fromPromise';

even if I suppress typescript error it still results in error:

(<any>Observable).fromPromise

Error:

Uncaught (in promise): TypeError: __WEBPACK_IMPORTED_MODULE_3_rxjs_Observable__.Observable.fromPromise is not a function

Somewhat similar issue was reported on rxjs repo here but there is no solution there either.

Answers


UPDATE:

As of rxjs 6.0.0-beta.3, operators and observable creators should be imported from rxjs. Furthermore, fromPromise is not part of the public API anymore and its wrapped in the from method.

TL;DR;

UPDATE

For rxjs 6.0.0 use:

import { from } from 'rxjs';

var observableFromPromise =  from(promiseSrc);

UPDATE:

After the release of the pipeable operators in rxjs 5.5.x, the monkey patch approach is strongly discouraged. Consider to use the static method option.

Original answer

As of rxjs 5.4.x, fromPromise can be used as a static method or can be patched into the Observable prototype.

For the first, you can do the following:

import { fromPromise } from 'rxjs/observable/fromPromise';

var observableFromPromise = fromPromise(promiseSrc);

More info about this approach here

To do the second, you need to change your import statement:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/fromPromise';

var observableFromPromise = Observable.fromPromise(promiseSrc);

More info about this approach here

Personally I would recommend the first one, considering that the 2nd approach is basically the 1rst, with the difference that the Observable prototype is changed.


like what Jota said 'from' is the answer.

you can find the reference from here

https://www.learnrxjs.io/operators/creation/from.html

However, if you want to specify 'Promise to Observable' you could use 'fromPromise' like below.

  import { from as fromPromise, Observable} from 'rxjs';
  ...

  private getObservable(): Observable<any> {
    return fromPromise(this.promise);
  }


  private getPromise() {

   this.promise = new Promise((resolve, reject) => {
      this.service.getPromise()
        .then(response => {
          //  do sth
          resolve(response);
        });
    });
}

Need Your Help

Proper way to use JQuery when using MasterPages in ASP.NET?

asp.net jquery master-pages fancybox

I have no issues when doing using JQuery in a aspx page without a masterpage, but when I try to use it in pages that have a masterpage, it doesn't work, so I end up putting the jquery files and other

How, if at all, do Erlang Processes map to Kernel Threads?

multithreading erlang parallel-processing lightweight-processes

Erlang is known for being able to support MANY lightweight processes; it can do this because these are not processes in the traditional sense, or even threads like in P-threads, but threads entirel...