Reactive programming expresses frontend behavior through changing state and events. In Angular, a component renders state, then reacts when asynchronous events change that state and trigger updated UI. section 5.1
The core distinction is how code receives data:
- A pull system requests stored data when execution reaches a function call, as with getData() followed by alert(data). section 5.1
- An event-driven system registers a handler and receives data later, as with a click listener that reacts when the event occurs. section 5.1
- State acts as the single source of truth: events change it, and the UI reflects the resulting value. section 5.1
Counter component
A counter stores count as state, displays it in the template, and binds increment() and decrement() to button-click events. Each event changes state, which updates the rendered value. section 5.1
RxJS is the primary tool for applying reactive programming in Angular. Modern Angular integration also supports takeUntilDestroyed for component cleanup and inject for dependency-aware custom RxJS operators. section 5.0 section 5.6
