javascript - 如何使用 rxjs 以一定的时间间隔从一定范围内发出整数

标签 javascript angular rxjs reactive-programming rxjs5

我正在使用它,但间隔运算符希望在范围内不存在的可观察对象上,是否有一种方法可以让可观察对象发出例如以 1 秒的间隔发出 60 个整数,我一直在这样做

 this.clock = Observable.range(1,60);
 this.clock = this.clock.interval(1000).map(function(value){
     console.log(value)
     return value;
 })

它说区间不是一个函数

也试过这个:

 this.clock = Observable.range(1,60).interval(1000).map(function(value){
     console.log(value)
     return value;
 })

最佳答案

要有一个从 1 到 60 的序列,时间间隔为 1 秒:

Observable
  .interval(1000)
  .map(x => x + 1) // to start from 1 instead of 0
  .map(x => console.log(x)) // do some logic here
  .take(60)
  .subscribe();

这里的输出是:

1
2
3
.
.
.
58
59
60

这是您可以运行以查看输出的片段:

// just to have the working demo on SO
let output = '';
let divToUpdate = document.getElementById('counter');

// observable
Rx.Observable
  .interval(1000)
  .map(x => x + 1) // to start from 1 instead of 0
  .map(x => {
    output = `${output}<br>${x}`;
    divToUpdate.innerHTML = output;
  })
  .take(60)
  .subscribe();
<div id="counter"></div>

<script src="https://npmcdn.com/rxjs@5.0.0-beta.7/bundles/Rx.umd.js"></script>

关于javascript - 如何使用 rxjs 以一定的时间间隔从一定范围内发出整数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40781903/

相关文章:

Angular 6 rxjs 管道不返回数据

javascript - 确保组件的客户端库文件仅在组件存在时加载到页面上的最佳方法是什么?

angular - VS Code 修复库的导入路径

javascript - 如何在运行时配置 MsAdalAngular6Module?

java - Spring Boot 视频聊天

javascript - Angular 返回未定义

javascript - 仅使用 RxJs 重新实现 redux observable?

javascript - 在 JavaScript 中设置动态下拉值

javascript - 如何获取div中包含的字符串

javascript - 无法 GET/定义路由