Working with RxJS in Angular

Working with RxJS is the sixth chapter of the free Angular tutorial. Many things in a web app happen over time: server responses arrive later, users type and click, timers tick and route parameters change. Angular uses the RxJS library to work with these values, and its HTTP client and router return RxJS Observables.

What the lesson covers:

  • RxJS Fundamentals: Observables, observers and subscriptions; the operators pipe(), map(), filter(), tap() and switchMap(); Subjects and BehaviorSubject for sharing values; the async pipe; error handling with catchError() and finalize(); and how to avoid memory leaks by unsubscribing, including automatic cleanup with takeUntilDestroyed().

Every practice block runs real Angular and RxJS in your browser, in TypeScript or JavaScript. Click the buttons in the output to send new values through the streams. The exercises check what your page displays after you change the code, so any correct answer passes.

Lessons in this section

  1. RxJS Fundamentals

    Working with values over time using RxJS: Observables, observers, subscriptions, the pipe, map, filter, tap and switchMap operators, Subjects, BehaviorSubject, the async pipe, error handling and automatic cleanup with takeUntilDestroyed.