withLatestFrom

function stable

Combines the source Observable with other Observables to create an Observable whose values are calculated from the latest values of each, only when the source emits.

`withLatestFrom<T, R>(...inputs: any[]): OperatorFunction<T, R | any[]>`

Parameters

inputs

Type: any[].

Returns

OperatorFunction<T, R | any[]>: A function that returns an Observable of projected values from the most recent values from each input Observable, or an array of the most recent values from each input Observable.

Description

Whenever the source Observable emits a value, it computes a formula using that value plus the latest values from other input Observables, then emits the output of that formula.

withLatestFrom marble diagram

withLatestFrom combines each value from the source Observable (the instance) with the latest values from the other input Observables only when the source emits a value, optionally using a project function to determine the value to be emitted on the output Observable. All input Observables must emit at least one value before the output Observable will emit a value.

Example

On every click event, emit an array with the latest timer event plus the click event

import { fromEvent, interval } from 'rxjs';
import { withLatestFrom } from 'rxjs/operators';

const clicks = fromEvent(document, 'click');
const timer = interval(1000);
const result = clicks.pipe(withLatestFrom(timer));
result.subscribe(x => console.log(x));