[RxJS] Use groupBy in real RxJS applications
This lesson will show when to apply groupBy in the real world. This RxJS operator is best suited when a source observable represents many data sources, e.g. an observable for multitouch events.
const busObservable = Rx.Observable.of(
{code: 'en-us', value: '-TEST-'},
{code: 'en-us', value: 'hello'},
{code: 'es', value: '-TEST-'},
{code: 'en-us', value: 'amazing'},
{code: 'pt-br', value: '-TEST-'},
{code: 'pt-br', value: 'olá'},
{code: 'es', value: 'hola'},
{code: 'es', value: 'mundo'},
{code: 'en-us', value: 'world'},
{code: 'pt-br', value: 'mundo'},
{code: 'es', value: 'asombroso'},
{code: 'pt-br', value: 'maravilhoso'}
).concatMap(x => Rx.Observable.of(x).delay()); const all = busObservable
.groupBy(obj => obj.code) // 2-d obs
.mergeMap(innerObs => innerObs.skip().map(obj => obj.value)); all.subscribe(x => console.log(x));
/*
"hello"
"amazing"
"olá"
"hola"
"mundo"
"world"
"mundo"
"asombroso"
"maravilhoso"
*/
- The 'groupBy' return a 2-d observable, can use 'switchMap' or 'mergeMap' to conver to 1-d observable.
[RxJS] Use groupBy in real RxJS applications的更多相关文章
- [RxJS + AngularJS] Sync Requests with RxJS and Angular
When you implement a search bar, the user can make several different queries in a row. With a Promis ...
- [RxJS] Refactoring Composable Streams in RxJS, switchMap()
Refactoring streams in RxJS is mostly moving pieces of smaller streams around. This lessons demonstr ...
- [RxJS] Reactive Programming - Why choose RxJS?
RxJS is super when dealing with the dynamic value. Let's see an example which not using RxJS: var a ...
- [RxJS] Learn How To Use RxJS 5.5 Beta 2
The main changes is about how you import rxjs opreators from now on. And introduce lettable opreator ...
- [rxjs] Creating An Observable with RxJS
Create an observable var Observable = Rx.Observable; var source = Observable.create(function(observe ...
- [RxJS] Reactive Programming - What is RxJS?
First thing need to understand is, Reactive programming is dealing with the event stream. Event stre ...
- [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 ...
- [转]VS Code 扩展 Angular 6 Snippets - TypeScript, Html, Angular Material, ngRx, RxJS & Flex Layout
本文转自:https://marketplace.visualstudio.com/items?itemName=Mikael.Angular-BeastCode VSCode Angular Typ ...
- rxjs的世界
rxjs学习了几个月了,看了大量的东西,在理解Observable的本文借鉴的是渔夫的故事,原文,知识的主线以<深入浅出rxjs>为主,动图借鉴了rxjs中文社区翻译的文章和国外的一个动图 ...
随机推荐
- BZOJ5137: [Usaco2017 Dec]Standing Out from the Herd(广义后缀自动机,Parent树)
Description Just like humans, cows often appreciate feeling they are unique in some way. Since Farme ...
- 洛谷 P2616 [USACO10JAN]购买饲料II Buying Feed, II
洛谷 P2616 [USACO10JAN]购买饲料II Buying Feed, II https://www.luogu.org/problemnew/show/P2616 题目描述 Farmer ...
- ubuntu-软件解压方法(转载)
一下内容转载自 http://blog.csdn.net/zad522/article/details/2770446 今天用到了ubuntu解压,所以就在网上查找了下方法.自己菜鸟一枚,收录别人的文 ...
- h.264硬件解码
// H264HWDecoder.m // H264EncoderDecoder // // Created by lujunjie on 2016/11/28. // Copyright © 201 ...
- 需求:在浏览器加载完毕后,自动播放视频:出现play() failed because the user didn't interact with the document first.错误
解决方法:给video标签加入<video muted></video> 静音即可. Chrome 66为了避免标签产生随机噪音. 参考链接:https://juejin.im ...
- web前端背景介绍
Internet:是一个全球性的计算机互联网络,中文名称“因特网”.“国际互联网”.“网际网”等等: Internet提供的服务:http.ftp.Telnet.email.www.bbs等等: 基本 ...
- Excel数据比对-批量数据比对
1.导出现场的Excel收费规则2.有专门的代码写的测试收费规则的工具(开发自己开发的)3.在这个工具上选择,导出的收费规则Excel,点击导出按钮(导出按钮里面有计算每一列的计费结果4.Excel里 ...
- Docker---(6)问题:bash: vi: command not found
原文:Docker---(6)问题:bash: vi: command not found 版权声明:欢迎转载,请标明出处,如有问题,欢迎指正!谢谢!微信:w1186355422 https://bl ...
- Emgucv 图像操作笔记
这里记下一些学习过程中的心得和技巧.我用VS2008,C#的平台进行编写. 1.将图片载入PictureBox的方法: Image<Bgr, byte> img = new Image&l ...
- amazeui学习笔记--css(常用组件9)--导航nav
amazeui学习笔记--css(常用组件9)--导航nav 一.总结 1.导航基本使用:<ul> 添加 .am-nav class 以后就是一个基本的垂直导航.默认样式中并没有限定导航的 ...