如何延迟创建可观察对象


92

为了进行测试,我创建的Observable对象将实际的http调用返回的可观察值替换为Http

我的可观察对象是使用以下代码创建的:

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

问题是,这个可观察的立即发出。有没有一种方法可以为其发射增加自定义延迟?


跟踪

我尝试了这个:

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

但这似乎不起作用。



我试图.create(...)与之链接,.delay(1000)但没有成功:Observable_1.Observable.create(...)。delay不是一个函数。
艾德里安·布鲁内拉特

1
您到底想完成什么?
君特Zöchbauer

您正在订阅可观察的内容吗?
shusson

用我自己的观察来伪造Http响应延迟。@shusson是的,我正在测试的类正在为可观察的对象调用服务(我正在尝试模拟)以便订阅它。
艾德里安·布鲁内拉特

Answers:


144

使用以下导入:

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

试试这个:

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

更新:RXJS 6

上面的解决方案在新版本的RXJS(例如,角度版本)中不再有效。

因此,情况是我有一系列要与API一起检查的项目。该API仅接受一个项目,并且我不想一次发送所有请求来终止该API。因此,我需要定时释放Observable流上的项目,并且之间要稍加延迟。

使用以下导入:

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

然后使用以下代码:

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

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

它基本上为数组中的每个项目创建了一个新的“延迟” Observable。可能还有许多其他方法可以执行此操作,但是这对我来说效果很好,并且符合“新” RXJS格式。


2
属性“ of”在类型“ typeof Observable”上不存在。您是否将Observable导入import {Observable} from 'rxjs/Observable';
Adrien Brunelat

1
在此页面上:npmjs.com/package/rxjs。我推断出必须使用明确导入import 'rxjs/add/observable/of';。你碰巧做同样的事情吗?不过,这仍然很奇怪,因为它不会与.delay(...)链接,并且在我尝试时会显示错误rxjs/add/observable/delay...
Adrien Brunelat

4
应该 of(item.pipe ( delay( 1000 ) ))of(item))).pipe(delay(1000)试图管阵列给我的错误
唐·托马斯·博伊尔

1
这是使用rxjs6对我有用的东西:from([[1,2,3,4,5,6,7])。pipe(concatMap(num => of(num).pipe(delay(1000))))。 subscription(x => console.log(x));
罗伯特

1
@MikeOne的解决方案也对我有用。
不幸的

103

在RxJS 5+中,您可以像这样

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

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

在RxJS 6+中

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

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

如果要延迟每个发射值,请尝试

from([1, 2, 3]).pipe(concatMap(item => of(item).pipe(delay(1000))));

4
我认为最干净的解决方案。
Maayao

仅当您发出一项时,此“解决方案”才有效。不会为可观察对象中的每个元素调用延迟运算符。这就是为什么需要可怕的concatMap解决方案的原因。
里克·奥谢

1
@ RickO'Shea,问题是关于一个发射值,所以这就是为什么这种解决方案。
Adrian Ber

1
如此新鲜,如此干净!
Nahn

我更新了多次延迟的答案@ RickO'Shea
Adrian Ber

12

您想要的是一个计时器:

// 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));

3
好答案,别忘了退订
Sami,

8

答案为时不晚...但是以防万一有人返回这个问题以寻找答案

“延迟”是可观察对象的属性(函数)

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

这对我有用...


1
import 'rxjs/add/operator/delay' 现在给出此错误: 找不到模块:错误:无法解决“ rxjs / add / operator / delay”
Aggie Jon

当真实性很强时,为什么还要称其为可观察的假性?:)
lagoman

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.