angular - observables - ¿Cómo puedo crear un observable con retraso?

observables angular 5

Question

Pregunta

Para fines de prueba, estoy creando objetos Observable que reemplazan los observables que serían devueltos por una llamada http real con Http .

Mi observable se crea con el siguiente código:

fakeObservable = Observable.create(obs => {
  obs.next([1, 2, 3]);
  obs.complete();
});

La cosa es que este observable emite inmediatamente. ¿Hay alguna manera de agregar un retraso personalizado a su emisión?

Pista

Intenté esto:

fakeObservable = Observable.create(obs => {
  setTimeout(() => {
    obs.next([1, 2, 3]);
    obs.complete();
  }, 100);
});

Pero no parece funcionar.

Answer 1

En RxJS 5+ puedes hacerlo así

import { Observable } from "rxjs/Observable";
import { of } from "rxjs/observable/of";
import { delay } from "rxjs/operators";

fakeObservable = of(''dummy'').pipe(delay(5000));

En RxJS 6+

import { of } from "rxjs";
import { delay } from "rxjs/operators";

fakeObservable = of(''dummy'').pipe(delay(5000));

Answer 2

Es un poco tarde para responder ... pero por si acaso alguien puede regresar a esta pregunta en busca de una respuesta

''delay'' es propiedad (función) de un Observable

fakeObservable = Observable.create(obs => {
  obs.next([1, 2, 3]);
  obs.complete();
}).delay(3000);

Esto funcionó para mí ...

Answer 3

Lo que quieres es un temporizador:

// RxJS v6+
import { timer } from ''rxjs'';

//emit [1, 2, 3] after 1 second.
const source = timer(1000).map(([1, 2, 3]);
//output: [1, 2, 3]
const subscribe = source.subscribe(val => console.log(val));

Answer 4

Usando las siguientes importaciones:

import {Observable} from ''rxjs/Observable'';
import ''rxjs/add/observable/of'';
import ''rxjs/add/operator/delay'';

Prueba esto:

let fakeResponse = [1,2,3];
let delayedObservable = Observable.of(fakeResponse).delay(5000);
delayedObservable.subscribe(data => console.log(data));

ACTUALIZACIÓN: RXJS 6

La solución anterior ya no funciona en las versiones más nuevas de RXJS (y de angular, por ejemplo).

Entonces, el escenario es que tengo una serie de elementos para verificar con una API. La API solo acepta un único elemento, y no quiero eliminar la API enviando todas las solicitudes a la vez. Por lo tanto, necesito una publicación cronometrada de elementos en la secuencia Observable con un pequeño retraso en el medio.

Use las siguientes importaciones:

import { from, of } from ''rxjs'';
import { delay } from ''rxjs/internal/operators'';
import { concatMap } from ''rxjs/internal/operators'';

Luego use el siguiente código:

const myArray = [1,2,3,4];

from(myArray).pipe(
        concatMap( item => of(item).pipe ( delay( 1000 ) ))
    ).subscribe ( timedItem => {
        console.log(timedItem)
    });

Básicamente crea un nuevo Observable ''retrasado'' para cada elemento de su matriz. Probablemente hay muchas otras formas de hacerlo, pero esto funcionó bien para mí y cumple con el ''nuevo'' formato RXJS.

Answer 5

import * as Rx from ''rxjs/Rx'';

Deberíamos agregar la importación anterior para que el código de soplado funcione

Let obs = Rx.Observable
    .interval(1000).take(3);

obs.subscribe(value => console.log(''Subscriber: '' + value));