分类导航
HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsVueDojoJsonElectronNode.jsExpressXMLAjaxUnityReactFlexWeb前端微信小程序支付小程序百度小程序

angular – 如何手动停止Observable间隔？

Angularjs   发布时间：2022-04-20  发布网站：大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了angular – 如何手动停止Observable间隔？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我目前正在尝试制作这样的20秒计时器： 

this.timer = Observable.interval(1000).take(20).map((tick) => tick+1).subscribe((tick) => {
    this.reverseTimer = 20-tick;
})

如果我让Observable每次都达到20,这很好,但有时候,我想提前结束计时器.现在,我不能停止计时器,直到它在20秒后自动停止.

现在,当我希望它停止时,我将计时器隐藏在显示器中,但我需要它才能重新启动.如果我尝试在20秒之前重新启动计时器,则reverseTimer会在新计时器和旧计时器值之间闪烁,因为我没有停止旧计时器.

我已经尝试过this.timer.unsubscribe()但是我得到的错误是取消订阅对于计时器不存在.

解决方法

你应该看看 Timer操作符.您可以创建一个在给定延迟后发出特定项目的Observable.您可以轻松创建倒计时系统.

在这个例子中,我将创建一个计时器,然后在5秒后停止它.

const start = 20;

const source = Rx.observable
  .timer(1000,1000)
  .map(tick => start - tick)
  .take(start + 1)
  .subscribe(tick => console.log(tick));


setTimeout(() => {
  //Stop the timer
  source.unsubscribe();
},5000);

你可以看到Working plunkr

大佬总结

以上是大佬教程为你收集整理的angular – 如何手动停止Observable间隔？全部内容，希望文章能够帮你解决angular – 如何手动停止Observable间隔？所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
标签：angularobservable停止如何手动间隔
猜你在找的Angularjs相关文章
其他相关热搜词更多
phpJavaPython程序员load中如何string使用参数jquery开发安装listlinuxiosandroid工具javascriptcap