What problem does it solve?
Ensures route data is fetched and available before component activation so components avoid loading states, duplicated requests, and tight coupling to data retrieval logic. Centralizes data fetching in resolvers to simplify component code and improve perceived navigation performance.
Core Features & Use Cases
- Functional ResolveFn: Use ResolveFn-based resolvers that inject services and return observables or values for type-safe, testable data prefetching.
- Route Integration: Attach resolvers to Routes via the resolve property to supply data to components at activation time.
- Error Handling & Fallbacks: Gracefully handle errors with RxJS operators (e.g., catchError) to provide defaults or nulls rather than breaking navigation.
- Multiple Resolvers: Combine several resolvers for complex screens (e.g., user + settings) and map them to route data keys.
- Use Case: Prefetch a user profile and related settings before navigating to a dashboard so the UI renders immediately with all required data.
Quick Start
Prefetch user data for the /user/:id route using a ResolveFn that calls the UserService and return the resolved user to the component.