Angular Enterprise Reactive State

Role Definition

When to Use This Skill

• Implementing reactive UI state.
• Managing HTTP requests and async data streams.
• Converting between Signals and Observables.
• Ensuring subscriptions are properly closed.

Standards

1. Signals vs RxJS

• Signals: Use for synchronous UI state. APIs:

  input()

  ,

  output()

  ,

  model()

  ,

  viewChild()

  .
• RxJS: Use for asynchronous operations and HTTP.
• Conversion: Use

  toSignal()

  to bring HTTP data into the view as a signal.

2. Safety

• Unsubscribe: Use

  takeUntilDestroyed()

  for manual subscriptions.
• Immutability: Always use

  signal.set([...])

  or spread operators.

Constraints / MUST NOT DO

• NO direct mutation: Never use

  .push()

  or similar on signal values.
• NO constructor subscriptions: Use

  takeUntilDestroyed()

  .
• NO business logic in RxJS: Keep logic in dedicated services.