RxJS延迟至少X毫秒
RxJS延迟至少X毫秒
提问于 2017-04-07 18:07:26
我试图在RxJS中实现以下行为：
- 引发事件
- 调用http API
- 当API返回时，也可以：
- 等待，直到触发事件后至少过了X毫秒
- 如果触发事件后X毫秒已过，则立即返回
这对于UX非常有用，因为即使调用需要1ms，我也想显示至少100 is的加载图标。
我还没有找到用delay、throttle、debounce或其变体来实现这一点的任何方法。
this.eventThatFires
.switchMap(data => {
let startTime = Date.now();
return this.callHttpService(data)
.delay(new Date(startTime + 1000));
})我认为这样的方法是有效的，但使用绝对日期似乎与当前时间存在时间差，而不是为绝对时间安排延迟。
编辑：
似乎没有像我所描述的那样的内置操作符。我之所以创建它，是因为我将在整个应用程序中大量使用它：
import { Observable } from "rxjs/Observable";
function delayAtLeast<T>(this: Observable<T>, delay: number): Observable<T> {
return Observable.combineLatest(
Observable.timer(delay),
this)
.map(([_, i]) => i);
}
Observable.prototype.delayAtLeast = delayAtLeast;
declare module "rxjs/Observable" {
interface Observable<T> {
delayAtLeast: typeof delayAtLeast;
}
}回答 5
Stack Overflow用户
回答已采纳
发布于 2017-04-07 19:42:45
实际上，按日期计算的delay与delay在数量上是相同的，唯一的区别是将延迟持续时间计算为指定日期和当前时间的差异。
当发出值时，可以使用delayWhen运算符计算延迟：
this.eventThatFires
.switchMap(data => {
let startTime = Date.now();
return this.callHttpService(data)
.delayWhen(() => Rx.Observable.timer(500 + startTime - Date.now()))
})Stack Overflow用户
发布于 2017-04-07 19:31:49
您的combineLatest解决方案有什么问题？
您也可以使用zip
this.eventThatFires
.switchMap(data => Observable.zip(
this.profileService.updateInfo(profileInfo)),
Observable.timer(500),
x => x));Stack Overflow用户
发布于 2019-06-10 13:17:09
基于博格丹·萨夫卢克的答案。延迟功能解耦：
let effectiveDelay=(delay)=>{
let effectiveTimer = (now=>delay=>timer(delay+now - Date.now() )) (Date.now())
return delayWhen(()=>effectiveTimer(delay));
}
this.eventThatFires
.switchMap(data => this.callHttpService(data)
.pipe(effectiveDelay(500)))http请求的情况(至少每x秒进行一次投票)
of({}).pipe(
switchMap(data => {
return ajax({url:"https://httpbin.org/delay/2", crossDomain:true})
.pipe(effectiveDelay(1000), map(ax=>ax.response) )
}), tap(display), repeat())
.subscribe()请参阅：在线
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43284550
复制相关文章
相似问题
腾讯云开发者
