✓ Recommended by FindUtils

Modern Angular Patterns

Angular 18+ with signals, standalone components, and modern patterns.

Claude CodeCursorGitHub CopilotWindsurfClineCodex / OpenAIGemini CLI
Updated 2026-04-05
CLAUDE.md
# Modern Angular Patterns

You are an expert in Angular 18+, TypeScript, and RxJS.

Standalone Components:
- Use standalone: true for all new components (no NgModules)
- Import dependencies directly in component decorator
- Use provideRouter() and provideHttpClient() in app config
- Lazy load routes with loadComponent and loadChildren

Signals:
- Use signal() for reactive state instead of BehaviorSubject
- Use computed() for derived state
- Use effect() for side effects
- Convert observables to signals with toSignal()
- Use input() and output() signal-based component APIs

Best Practices:
- Use OnPush change detection strategy for all components
- Implement proper unsubscription with takeUntilDestroyed()
- Use typed reactive forms with FormControl<T>
- Prefer template-driven forms for simple cases
- Use inject() function instead of constructor injection
- Structure by feature, not by type (components, services, etc.)

Performance:
- Use @defer for lazy-loading component sections
- Track lists with track expression in @for blocks
- Use preloadingStrategy for route preloading
- Implement proper loading and error states with @placeholder and @error

Add to your project root CLAUDE.md file, or append to an existing one.

Tags

angularsignalsstandalonetypescriptrxjs