Angular Best Practices

Angular 21 Best Practices

TypeScript

• Use strict type checking
• Prefer type inference when type is obvious
• Avoid any; use unknown when type is uncertain

Components

• Always use standalone components (do NOT set standalone: true — it's the default in v20+)
• Set changeDetection: ChangeDetectionStrategy.OnPush
• Use input() and output() functions instead of decorators
• Use computed() for derived state
• Keep components small and single-responsibility
• Prefer inline templates for small components
• Use Reactive forms over Template-driven
• Use class bindings instead of ngClass
• Use style bindings instead of ngStyle
• For external templates/styles, use paths relative to the component TS file
• Do NOT use @HostBinding/@HostListener — use the host object in the decorator instead

State Management with Signals

• Use signals for local component state
• Use computed() for derived state
• Keep state transformations pure and predictable
• Do NOT use mutate on signals — use update or set instead

For complex derived state patterns, see references/signal-patterns.md.

Resources (Async Data)