What problem does it solve?
Angular apps often become harder to reason about when state changes are spread across Observables, BehaviorSubjects, and side-effectful subscriptions, leading to complex change detection and brittle reactive flows.
Core Features & Use Cases
- Writable reactive state with signal(): Model local and shared state (e.g., counters, user sessions, selected items) with synchronous reads.
- Derived state with computed(): Keep UI-ready values consistent by recalculating automatically when dependencies change (e.g., filtered lists, totals, derived flags).
- Dependent state with linkedSignal(): Implement reset/preservation behaviors when source state changes (e.g., reset selection when options change while preserving selection when possible).
- Side effects with effect(): Trigger controlled side-effect logic in response to state changes, with proper cleanup when components destroy.
- RxJS interop for gradual migration: Convert Observables to signals with toSignal() and convert signals back to Observables with toObservable() for operator-based flows.
Use case: You have a dashboard with provider/consumer/library selection, and you want filters, loading flags, and computed summaries to update instantly and predictably as the user changes inputs—without manual subscription management.
Quick Start
Use the angular-signals skill to implement Angular component state with signals by defining writable state with signal(), deriving UI values with computed(), and performing reactive side effects with effect().