There are variants of the window operator that allow you to split RxJS observables in different ways. In this lesson we will explore the windowToggle variant and see one of its use cases in user interfaces.

Let's say we want to build a new functionality, it only receive the source when mousedown and stop receiving data when mouse up.

To do that we can use 'windowToggle':

const clockObs = Rx.Observable.interval();
const downObs = Rx.Observable.fromEvent(document, 'mousedown');
const upObs = Rx.Observable.fromEvent(document, 'mouseup'); const source = clockObs
.windowToggle(downObs, () => upObs)
.switch()
.subscribe(console.log); /*
--0--1--2--3--4--5--6--7--8--9--
windowToggle
----------D--------U-------------
\
-3--4--5-| switch / mergeAll -----------3--4--5---------------
*/

[RxJS] Split an RxJS observable conditionally with windowToggle的更多相关文章

  1. [RxJS] Split an RxJS observable with window

    Mapping the values of an observable to many inner observables is not the only way to create a higher ...

  2. [RxJS] Split an RxJS Observable into groups with groupBy

    groupBy() is another RxJS operator to create higher order observables. In this lesson we will learn ...

  3. [RxJS] Stopping a shared observable execution

    ConnectableObservable has the connect() method to conveniently dictate the start of the shared execu ...

  4. [RxJS] Introduction to RxJS Marble Testing

    Marble testing is an expressive way to test observables by utilizing marble diagrams. This lesson wi ...

  5. [AngularJS + RxJS] Search with RxJS

    When doing search function, you always need to consider about the concurrent requests. AEvent ----(6 ...

  6. Angular快速学习笔记(4) -- Observable与RxJS

    介绍RxJS前,先介绍Observable 可观察对象(Observable) 可观察对象支持在应用中的发布者和订阅者之间传递消息. 可观察对象可以发送多个任意类型的值 -- 字面量.消息.事件. 基 ...

  7. RxJS——可观察的对象(Observable)

    可观察的(Observable) 可观察集合(Observables)是多值懒推送集合.它们填补了下面表格的空白: SINGLE MULTIPLE Pull Function Iterator Pus ...

  8. RxJS v6 学习指南

    为什么要使用 RxJS RxJS 是一套处理异步编程的 API,那么我将从异步讲起. 前端编程中的异步有:事件(event).AJAX.动画(animation).定时器(timer). 异步常见的问 ...

  9. 《深入浅出RxJS》读书笔记

    rxjs的引入 // 如果以这种方式导入rxjs,那么整个库都会导入,我们一般不可能在项目中运用到rxjs的所有功能 const Rx = require('rxjs'); 解决这个问题,可以使用深链 ...

随机推荐

  1. 中间件 —— 消息中间件(MOM)

    维基百科对消息中间件的定义为:Message-oriented middleware (MOM) is software or hardware infrastructure supporting s ...

  2. Spring源码分析专题——目录

    Spring源码分析专题 -- 阅读指引 IOC容器 Spring源码分析专题 -- IOC容器启动过程(上篇) Spring源码分析专题 -- IOC容器启动过程(中篇) Spring源码分析专题 ...

  3. BZOJ3620: 似乎在梦中见过的样子(KMP)

    Description “Madoka,不要相信 QB!”伴随着 Homura 的失望地喊叫,Madoka 与 QB 签订了契约. 这是 Modoka 的一个噩梦,也同时是上个轮回中所发生的事.为了使 ...

  4. 《开源公开课分享》:Java开源框架案例分享

        缺乏高端技术人才?缺乏开发标准?    代码复用性低?技术风险难于把控?     招聘成本高?培训成本高?    假设想法不够雄伟,那么就会局限于细节:假设一開始就铺很大的摊子,将会失去控制: ...

  5. Oracle 12C R2 on Linux 7.X Data Guard 搭建文档

    1.查看主机和数据库信息   [oracle@oracle1 ~]$ sqlplus / as sysdba   SQL*Plus: Release 12.2.0.1.0 Production on ...

  6. 记一些stl的用法(持续更新)

    有些stl不常用真的会忘qwq,不如在这里记下来,以后常来看看 C++中substr函数的用法 #include<string> #include<iostream> usin ...

  7. Jenkins学习总结(1)——Jenkins详细安装与构建部署使用教程

    Jenkins是一个开源软件项目,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能.Jenkins是基于Java开发的一种持续集成工具,用于监控持续重复的工作,功能包括: 1.持续的软件版本发 ...

  8. 8.Swift教程翻译系列——控制流之条件

    3.条件语句 常常会须要依据不同的情况来运行不同的代码. 你可能想要在错误发生的时候运行一段额外的代码,或者当某个值变得太高或者太低的时候给他输出出来.要实现这些需求,你能够使用条件分支. Swift ...

  9. [寒江孤叶丶的Cocos2d-x之旅_36]用LUA实现UTF8的字符串基本操作 UTF8字符串长度,UTF8字符串剪裁等

    原创文章,欢迎转载,转载请注明:文章来自[寒江孤叶丶的Cocos2d-x之旅系列] 博客地址:http://blog.csdn.net/qq446569365 一个用于UTF8字符串操作的类.功能比較 ...

  10. amazeui学习笔记--css(常用组件8)--列表list

    amazeui学习笔记--css(常用组件8)--列表list 一.总结 1.链接列表:就是多个链接在一起组成的列表, 使用 <ul> 结构嵌套链接列表,添加 .am-list.还是ui包 ...