[RxJS] Toggle A Stream On And Off With RxJS
2016-03-15 21:15
483 查看
This lesson covers how to toggle an observable on and off from another observable by showing how to use a checkbox as a toggle for a stream of data.
<!DOCTYPE html> <html> <head> <script src="https://npmcdn.com/@reactivex/rxjs@5.0.0-alpha.8/dist/global/Rx.js"></script> <meta charset="utf-8"> <title>JS Bin</title> </head> <body> <input type="checkbox" id="toggle"> <div id="display"></div> </body> </html>
const display = document.querySelector('#display'); const toggle = document.querySelector('#toggle'); const source$ = Rx.Observable.interval(100) .map(() => '.'); const checked$ = Rx.Observable.fromEvent(toggle, 'change') .map(e => e.target.checked); const sourceThatStop$ = source$.takeUntil(checked$); checked$ .filter( flag => flag === true) .switchMapTo( sourceThatStop$ ) .subscribe( (x) => { display.innerHTML += x; });
相关文章推荐
- JS BOM
- js判断浏览器是否有滚动条
- extjs 组件与布局
- jsp登录界面(一)
- JavaScript 简介
- js中的toString
- JSTL 核心标签库
- JS对象继承方法
- javascript中为什么有时需要创建立即执行的函数
- js面向对象二--封装
- 玩转JavaScript正则表达式
- JSP and Servlet
- JavaScript高级程序设计(第三版)学习笔记22、24、25章
- fastjson 使用笔记
- JavaScript打印杨辉三角
- JavaScript子文本传到父文本框显示
- 通用JSON生成器3
- JavaScript节点属性
- 用JS控制图片随鼠标移动
- js 数组定义与常用函数小结