Skip to content

Angular + RxJS#

RxJS is woven into Angular: HttpClient returns Observables, reactive forms expose valueChanges, the router streams events, and the async pipe subscribes for you. This section covers the patterns that make RxJS work well inside Angular applications.

Guides#

  • Async Pipe: let the template subscribe and unsubscribe for you, and avoid the most common source of memory leaks.
  • Signals & RxJS Interop: toSignal, toObservable, and deciding when signals replace RxJS.
  • HttpClient Patterns: loading/error/success state, sequential and parallel requests, cancellation, and resilient pipelines.
  • Reactive Forms: valueChanges pipelines for debounced search, autosave, and dependent fields.
  • Router: paramMap + switchMap, router events, and the component-reuse gotcha.
  • Interceptors & Retries: functional interceptors, retry strategies, and the three-layer error model.
  • Caching: shareReplay caches, refresh triggers, per-key maps, TTL, and stale-while-revalidate.
  • Memory Leaks & Subscription Cleanup: where leaks actually come from, how to find them, and the prevention toolbox.
  • RxJS Anti-Patterns: the habits that fail code reviews, each with its fix.

RxJS everywhere else#

Operator pages throughout this site use Angular examples: typeahead search with switchMap, double-submit protection with exhaustMap, and cached configuration with shareReplay.