concatMapTo

Projects each source value to the same Observable which is merged multiple times in a serialized fashion on the output Observable.

Deprecation Notes

Will be removed in v9. Use concatMap instead: concatMap(() => result)

concatMapTo<T, R, O extends ObservableInput<unknown>>(innerObservable: O, resultSelector?: (outerValue: T, innerValue: ObservedValueOf<O>, outerIndex: number, innerIndex: number) => R): OperatorFunction<T, ObservedValueOf<O> | R>

Parameters

innerObservable	O	An Observable to replace each value from the source Observable.
resultSelector	(outerValue: T, innerValue: ObservedValueOf<O>, outerIndex: number, innerIndex: number) => R	Optional. Default is undefined.

Returns

OperatorFunction<T, ObservedValueOf<O> | R>: A function that returns an Observable of values merged together by joining the passed Observable with itself, one after the other, for each value emitted from the source.

Description

It's like concatMap, but maps each value always to the same inner Observable.

Maps each source value to the given Observable innerObservable regardless of the source value, and then flattens those resulting Observables into one single Observable, which is the output Observable. Each new innerObservable instance emitted on the output Observable is concatenated with the previous innerObservable instance.

Warning: if source values arrive endlessly and faster than their corresponding inner Observables can complete, it will result in memory issues as inner Observables amass in an unbounded buffer waiting for their turn to be subscribed to.

Note: concatMapTo is equivalent to mergeMapTo with concurrency parameter set to 1.

Example

For each click event, tick every second from 0 to 3, with no concurrency

import { fromEvent, concatMapTo, interval, take } from 'rxjs';

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

// Results in the following:
// (results are not concurrent)
// For every click on the "document" it will emit values 0 to 3 spaced
// on a 1000ms interval
// one click = 1000ms-> 0 -1000ms-> 1 -1000ms-> 2 -1000ms-> 3

Overloads

concatMapTo(observable: O): OperatorFunction<unknown, ObservedValueOf<O>>

Parameters

observable

O

Returns

OperatorFunction<unknown, ObservedValueOf<O>>

concatMapTo(observable: O, resultSelector: undefined): OperatorFunction<unknown, ObservedValueOf<O>>

Parameters

observable	O
resultSelector	undefined

Returns

OperatorFunction<unknown, ObservedValueOf<O>>

concatMapTo(observable: O, resultSelector: (outerValue: T, innerValue: ObservedValueOf<O>, outerIndex: number, innerIndex: number) => R): OperatorFunction<T, R>

Parameters

observable	O
resultSelector	(outerValue: T, innerValue: ObservedValueOf<O>, outerIndex: number, innerIndex: number) => R

Returns

OperatorFunction<T, R>

See Also

• concat
• concatAll
• concatMap
• mergeMapTo
• switchMapTo