Htykuut

Lets consider following streams:

Stream1: 1  2  3  4  5  6  7  8  9                

Stream2: ab   c     d  f

Output I would like to get with combining these streams:

[1, a]

[2, b]

[3, c]

[4, c]

[5, d]

[6, f]

[7, f]

[8, f]

[9, f]

Sample Code Idea: StackBlitz Editor Link

const input$ = fromEvent(document, 'keydown')

  .pipe(

    map((event: KeyboardEvent) => event.keyCode)

  );

const source$ = interval(500).pipe(s$ => zip(s$, input$))

source$.subscribe(x => console.log(x));

So this is something like operators zip() and/or withLatestForm(), but I can't come up with solution

• Main idea is that I have interval of 500ms and on every tick I want to zip it with Keyboard Input Observable, which works how I would like, but as long I am not emitting Keyboard Input Observable everything stops. I want to keep emitting interval ticks, but if keyboard events stop then take the latest value

You can just use withLatestFrom

import { of, fromEvent, interval } from 'rxjs'; 

import { map, withLatestFrom } from 'rxjs/operators';



const input$ = fromEvent(document, 'keydown').pipe( map((event: KeyboardEvent) => event.keyCode));

const timer$ = interval(1000);

const source$ = timer$.pipe(withLatestFrom(input$));



source$.subscribe(x => console.log(x));

Try out this live demo at stackblitz -> https://stackblitz.com/edit/rxjs-bmx7hg

As soon as you focus the page and press some key, the stream will start and you will get an emitted value on every tick, no matter if you clicked a button since the last tick.