An OperatorFunction is the function shape behind an RxJS operator: it receives a source Observable and returns a destination Observable derived from it. The destination subscribes internally to the source and performs its operation along that path. Operators therefore do not modify the source; they create a separate Observable from it. section 5.4.1 section 5.4.2
Calls such as map(...) are better understood as operator creators: they return an OperatorFunction for use in pipe. The pipe method combines one or more OperatorFunctions into a larger function, then applies that function to the source Observable in declared order. section 5.4.1 section 5.4.2
Deriving a doubled stream
numbers$.pipe(map(n => n * 2)) creates doubledNumbers$ from numbers$. Subscribing to doubledNumbers$ reads doubled emissions while numbers$ continues with its own behavior. section 5.4.2
Custom operators can return an OperatorFunction directly, but RxJS pipe reduces the wrapper boilerplate. OperatorFunction accepts separate source and result types; MonoTypeOperatorFunction is the narrower form for operators that preserve the emission type, such as filter or a logging side effect. section 5.4.3 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 combines withLatestFrom, filter, and map into a reusable type-preserving pipeline that can inject a PermissionsService. section 5.4.3
Reusable permission check
hasPermissions(permissions) can be placed in an Angular HTTP interceptor pipeline, allowing requests to pass only when the permissions stream reports access. section 5.4.3
