🔁 Angular Signals + RxJS – Wann, wie, warum?

(Reaktive Power ohne Chaos – kombiniert oder getrennt einsetzen?)

Angular 16+ hat mit Signals ein neues Kapitel aufgeschlagen. Doch was ist mit RxJS?
Muss ich mich entscheiden – oder geht beides gemeinsam?

In diesem Beitrag schauen wir uns an, wann du RxJS brauchst,
wann Signals reichen und wie du beides smart kombinierst.

1️⃣ Signals ≠ Ersatz für RxJS

Signals sind super für lokalen State und UI-Reaktivität.
Aber RxJS glänzt bei Streams, Interaktionen & Nebenwirkungen.

2️⃣ Wann nur Signals?

const count = signal(0);
const doubled = computed(() => count() * 2);

effect(() => console.log('Zähler:', count()));

Perfekt für UI-Komponenten, einfache Zustände & lokale Reaktivität.

3️⃣ Wann nur RxJS?

this.users$ = this.http.get<User[]>('/api/users');

Ideal bei:

• HTTP, WebSockets
• Streams & Polling
• debounce, switchMap, mergeMap

4️⃣ Die Kombi: Signals + RxJS

const searchTerm = signal('');
const search$ = toObservable(searchTerm).pipe(
  debounceTime(300),
  switchMap((term) => this.api.search(term))
);

Tipp:

Nutze toSignal() / toObservable() aus @angular/core/rxjs-interop.

5️⃣ Anti-Pattern vermeiden

❌ Nie RxJS nur für lokalen State.
❌ Signals nicht missbrauchen für asynchrone Prozesse.

💡 Best of Both:

• Signals für Synchronicity + UI
• RxJS für Asynchronicity + Streams

Fazit

RxJS bleibt wichtig.
Signals sind ein Geschenk für UI-State.
Kombiniert eingesetzt bekommst du das Beste aus beiden Welten.

📚 Nächster Beitrag:
🛠 Angular Control Flow – @if, @for & @switch meistern