Item: RxJS playground
Rating: 3.4
Author: 1kohei1

0 Downloads
32 Views
Tweet
Download Now View Demo

HTML
JavaScript

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>RxJS playground</title>
  
  
  
  
  
</head>

<body>

  <input type="text" id="text">
<button id="click">click</button>
  <script src='https://unpkg.com/@reactivex/rxjs@5.0.1/dist/global/Rx.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js'></script>

  

    <script  src="js/index.js"></script>




</body>

</html>


/*Downloaded from https://www.codeseek.co/1kohei1/rxjs-playground-veNgaO */
let p1 = () => {
  return Promise.resolve(1);
};
let p2 = () => {
  return Promise.resolve(2);
}

let queue = new Rx.BehaviorSubject();
queue
.mergeMap(num => {
  const delay = Math.random() * 10000;
  console.log(`Execute ${num} in ${delay} milliseconds`);
  // return Rx.Observable.timer(delay, 1000)
  //   .take(1)
  return Promise.all([p1, p2]);
}, null, 2)
.subscribe(x => {
  console.log(x);
});

const clickObservable = Rx.Observable.fromEvent(
  document.getElementById('click'),
  'click'
);

clickObservable.subscribe(event => {
  let nums = document.getElementById('text').value.split(',');
  nums = _.filter(nums, (num) => { 
    return !!num
  })
  nums = _.map(nums, (num) => {
    return _.trim(num);
  });
  _.forEach(nums, num => {
    queue.next(num);
  })
});

Comments

More from 1kohei1

RxJS playground

In this example below you will see how to do a RxJS playground with some HTML / CSS and Javascript

Technologies

Comments

More from 1kohei1

SVG.js playground

RxJS playground

RxJS drag capture drag complete

Observable connect

You Might Also Like

Custom HTML5 Video Player / Vanilla JS 30.11

learning about functions

Flex-Wrap example

lesson3-6

A Pen by Olusegun Peterson

[Topic-09] Display, Pt. 2

Cold-Hot Toggle Switch

Interactive Rotating Wheel - VueJS