NgRx Effects can do much more than just handling HTTP calls triggered by actions. This post explores advanced use cases including: using RxJS Observables (like interval) or store selectors as effect sources, reusing effects for multiple actions, managing Angular Material dialogs and notifications, enriching actions with store state via concatLatestFrom, prefetching data by chaining effects, analytics/monitoring via the actions stream, listening to router changes, updating the window title, and navigating based on actions. The key takeaway is that moving side effects out of components into the effects model results in purer components and more testable, maintainable code.

7m read timeFrom timdeschryver.dev
Post cover image
Table of contents
Effects BasicExternal sourcesReusing EffectsHandling the flow of a ( Angular Material ) dialogShowing notificationsEnhance your action with Global Store statePrefetch dataAnalytics/monitoringListen to routerChange the windows titleNavigate based on actionsConclusion
2 Impressions