Groups the items emitted by an Observable according to a specified criterion,
and emits these grouped items as GroupedObservables, one
GroupedObservable per group.
groupBy<T, K, R>(keySelector: (value: T) => K, elementSelector?: ((value: T) => R) | void, durationSelector?: (grouped: GroupedObservable<K, R>) => Observable<any>, subjectSelector?: () => Subject<R>): OperatorFunction<T, GroupedObservable<K, R>>
Parameters
| keySelector |
A function that extracts the key
for each item.
|
| elementSelector |
Optional. Default is undefined.
A function that extracts the
return element for each item.
|
| durationSelector |
Optional. Default is undefined.
A function that returns an Observable to determine how long each group should
exist.
|
| subjectSelector |
Optional. Default is undefined.
Type: () => Subject.
|
Returns
OperatorFunction<T, GroupedObservable<K, R>>: An Observable that emits
GroupedObservables, each of which corresponds to a unique key value and each
of which emits those items from the source Observable that share that key
value.
Description
When the Observable emits an item, a key is computed for this item with the keySelector function.
If a GroupedObservable for this key exists, this GroupedObservable emits. Elsewhere, a new
GroupedObservable for this key is created and emits.
A GroupedObservable represents values belonging to the same group represented by a common key. The common
key is available as the key field of a GroupedObservable instance.
The elements emitted by GroupedObservables are by default the items emitted by the Observable, or elements
returned by the elementSelector function.
Examples
Group objects by id and return as array
import { mergeMap, groupBy, reduce } from 'rxjs/operators';
import { of } from 'rxjs/observable/of';
interface Obj {
id: number,
name: string,
}
of<Obj>(
{id: 1, name: 'javascript'},
{id: 2, name: 'parcel'},
{id: 2, name: 'webpack'},
{id: 1, name: 'typescript'},
{id: 3, name: 'tslint'}
).pipe(
groupBy(p => p.id),
mergeMap((group$) => group$.pipe(reduce((acc, cur) => [...acc, cur], []))),
)
.subscribe(p => console.log(p));
// displays:
// [ { id: 1, name: 'javascript'},
// { id: 1, name: 'typescript'} ]
//
// [ { id: 2, name: 'parcel'},
// { id: 2, name: 'webpack'} ]
//
// [ { id: 3, name: 'tslint'} ]
Pivot data on the id field
import { mergeMap, groupBy, map, reduce } from 'rxjs/operators';
import { of } from 'rxjs/observable/of';
of<Obj>(
{id: 1, name: 'javascript'},
{id: 2, name: 'parcel'},
{id: 2, name: 'webpack'},
{id: 1, name: 'typescript'}
{id: 3, name: 'tslint'}
).pipe(
groupBy(p => p.id, p => p.name),
mergeMap( (group$) => group$.pipe(reduce((acc, cur) => [...acc, cur], ["" + group$.key]))),
map(arr => ({'id': parseInt(arr[0]), 'values': arr.slice(1)})),
)
.subscribe(p => console.log(p));
// displays:
// { id: 1, values: [ 'javascript', 'typescript' ] }
// { id: 2, values: [ 'parcel', 'webpack' ] }
// { id: 3, values: [ 'tslint' ] }
Overloads
groupBy(keySelector: (value: T) => K): OperatorFunction<T, GroupedObservable<K, T>>
Parameters
| keySelector |
Type: (value: T) => K.
|
Returns
OperatorFunction<T, GroupedObservable<K, T>>
|
groupBy(keySelector: (value: T) => K, elementSelector: void, durationSelector: (grouped: GroupedObservable<K, T>) => Observable<any>): OperatorFunction<T, GroupedObservable<K, T>>
Parameters
| keySelector |
Type: (value: T) => K.
|
| elementSelector |
Type: void.
|
| durationSelector |
Type: (grouped: GroupedObservable) => Observable.
|
Returns
OperatorFunction<T, GroupedObservable<K, T>>
|
groupBy(keySelector: (value: T) => K, elementSelector?: (value: T) => R, durationSelector?: (grouped: GroupedObservable<K, R>) => Observable<any>): OperatorFunction<T, GroupedObservable<K, R>>
Parameters
| keySelector |
Type: (value: T) => K.
|
| elementSelector |
Optional. Default is undefined.
Type: (value: T) => R.
|
| durationSelector |
Optional. Default is undefined.
Type: (grouped: GroupedObservable) => Observable.
|
Returns
OperatorFunction<T, GroupedObservable<K, R>>
|
groupBy(keySelector: (value: T) => K, elementSelector?: (value: T) => R, durationSelector?: (grouped: GroupedObservable<K, R>) => Observable<any>, subjectSelector?: () => Subject<R>): OperatorFunction<T, GroupedObservable<K, R>>
Parameters
| keySelector |
Type: (value: T) => K.
|
| elementSelector |
Optional. Default is undefined.
Type: (value: T) => R.
|
| durationSelector |
Optional. Default is undefined.
Type: (grouped: GroupedObservable) => Observable.
|
| subjectSelector |
Optional. Default is undefined.
Type: () => Subject.
|
Returns
OperatorFunction<T, GroupedObservable<K, R>>
|