Saltar al contenido

Convertir Promesa en Observable

Luego de consultar con expertos en esta materia, programadores de deferentes ramas y maestros hemos dado con la respuesta al dilema y la dejamos plasmada en esta publicación.

Solución:

Si está utilizando RxJS 6.0.0:

import  from  from 'rxjs';
const observable = from(promise);

prueba esto:

import 'rxjs/add/observable/fromPromise';
import  Observable  from "rxjs/Observable";

const subscription = Observable.fromPromise(
    firebase.auth().createUserWithEmailAndPassword(email, password)
);
subscription.subscribe(firebaseUser => /* Do anything with data received */,
                       error => /* Handle error here */);

puede encontrar una referencia completa al operador fromPromise aquí.

1 Ejecución Directa / Conversión

Utilizar from para convertir directamente una Promesa creada previamente en un Observable.

import  from  from 'rxjs';

// getPromise() is called once, the promise is passed to the Observable
const observable$ = from(getPromise());

observable$ será un observable caliente que reproduce efectivamente el valor de las Promesas para los Suscriptores.

Es un Observable caliente porque el productor (en este caso, la Promesa) se crea fuera del Observable. Múltiples suscriptores compartirán la misma Promesa. Si la Promesa interna se ha resuelto, un nuevo suscriptor del Observable obtendrá su valor de inmediato.

2 ejecución diferida en cada suscripción

Utilizar defer con una función de fábrica de promesas como entrada para diferir la creación y conversión de una promesa en un observable.

import  defer  from 'rxjs';

// getPromise() is called every time someone subscribes to the observable$
const observable$ = defer(() => getPromise());

observable$ será un frío observable.

Es un Observable frío porque el productor (la Promesa) se crea dentro del Observable. Cada suscriptor creará una nueva Promesa llamando a la función de fábrica de Promesa dada.

Esto le permite crear un observable$ sin crear y, por lo tanto, ejecutar una Promesa de inmediato y sin compartir esta Promesa con múltiples suscriptores. Cada suscriptor de observable$ efectivamente llama from(promiseFactory()).subscribe(subscriber). Entonces, cada suscriptor crea y convierte su propia Promesa nueva en un Observable nuevo y se adjunta a este Observable nuevo.

3 Muchos operadores aceptan promesas directamente

La mayoría de los operadores RxJS que combinan (p. ej. merge, concat, forkJoin, combineLatest …) o transformar observables (p. ej. switchMap, mergeMap, concatMap, catchError …) aceptar promesas directamente. Si está usando uno de ellos de todos modos, no tiene que usar from envolver una promesa primero (pero para crear una frio observable es posible que aún tengas que usar defer).

// Execute two promises simultaneously
forkJoin(getPromise(1), getPromise(2)).pipe(
  switchMap(([v1, v2]) => v1.getPromise(v2)) // map to nested Promise
)

Verifique la documentación o la implementación para ver si el operador que está utilizando acepta ObservableInput o SubscribableOrPromise.

type ObservableInput = SubscribableOrPromise | ArrayLike | Iterable;
// Note the PromiseLike ----------------------------------------------------v
type SubscribableOrPromise = Subscribable | Subscribable | PromiseLike | InteropObservable;

La diferencia entre from y defer en un ejemplo: https://stackblitz.com/edit/rxjs-6rb7vf

const getPromise = val => new Promise(resolve => 
  console.log('Promise created for', val);
  setTimeout(() => resolve(`Promise Resolved: $val`), 5000);
);

// the execution of getPromise('FROM') starts here, when you create the promise inside from
const fromPromise$ = from(getPromise('FROM'));
const deferPromise$ = defer(() => getPromise('DEFER'));

fromPromise$.subscribe(console.log);
// the execution of getPromise('DEFER') starts here, when you subscribe to deferPromise$
deferPromise$.subscribe(console.log);

Eres capaz de patrocinar nuestra publicación mostrando un comentario y dejando una valoración te damos las gracias.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *