The RxJS pipe method combines operator functions into one observable transformation. Call it on an Observable, pass operators in their execution order, and subscribe to the resulting Observable. Its shape follows functional piping: each function receives the result produced by the preceding function. section 5.4.2
Function composition normally nests calls so the rightmost function runs first. Piping reverses that presentation: values move through functions in the same left-to-right order in which they are supplied. RxJS applies this idea specifically to an arbitrary number of OperatorFunctions. section 5.4.2
Transform emitted numbers
Pipe map into an Observable to create a stream whose values are doubled. The source emits 1, 2, and 3; subscribing to the transformed Observable logs 2, 4, and 6. section 5.4.2
Do not confuse the Observable.pipe method with the standalone pipe function. The method starts from an Observable; the function builds a reusable operator from other RxJS operators. This is useful when packaging repeated stream behavior behind a named custom operator. section 5.4.3
Listing 5.13 Custom RxJS operator that uses dependency injection
export function hasPermissions<T>(
permissions: Permissions[], #1
permissionsService = inject(PermissionsService), #2
): MonoTypeOperatorFunction<T> {
return pipe(
withLatestFrom(permissionsService.hasPermissions(permissions)), #3
filter(([, hasPermissions]) => hasPermissions), #4
map(([value]) => value) #5
);
}
A permission operator uses the standalone pipe function to combine withLatestFrom, filter, and map, then can be placed inside an HTTP Observable pipeline. section 5.4.3
When building a custom operator:
- Return an OperatorFunction; use MonoTypeOperatorFunction when the operator preserves the source emission type. section 5.4.3
- Use the standalone pipe function to compose the implementation from existing operators such as tap, filter, map, and withLatestFrom. section 5.4.3
- Apply the custom operator through an Observable’s pipe method, including in an Angular HTTP interceptor. section 5.4.3
