rxjs-patterns-for-angularlisted

# RxJS Patterns for Angular Skill This skill helps implement reactive patterns using RxJS in Angular applications. ## Core Principles ### Modern Angular + RxJS - **Signals First**: Use Signals for state, RxJS for async operations - **Auto Cleanup**: Use `takeUntilDestroyed()` for subscription management - **Interop**: Use `toSignal()` and `toObservable()` for Signal/Observable conversion - **AsyncPipe**: Prefer AsyncPipe in templates when not using Signals ### Key Concepts - Observables for async data streams - Operators for data transformation - Subscription management and cleanup - Error handling and retry logic ## Signal + RxJS Integration ### toSignal() - Observable to Signal ```typescript import { Component, inject } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; import { HttpClient } from '@angular/common/http'; @Component({ selector: 'app-task-list', template: ` @if (tasks(); as taskList) { @for (task of taskList; track task.id) { <div>{{ task.title }}</div> } } ` }) export class TaskListComponent { private http = inject(HttpClient); // Convert Observable to Signal tasks = toSignal( this.http.get<Task[]>('/api/tasks'), { initialValue: [] } ); } ``` ### toObservable() - Signal to Observable ```typescript import { Component, signal } from '@angular/core'; import { toObservable } from '@angular/core/rxjs-interop'; import { switchMap } from 'rxjs/operators'; @Component({ selecto