🦀 ClawHub
Angular
by @ivangdavila
Avoid common Angular mistakes — subscription leaks, change detection, dependency injection, and module organization.
TERMINAL
clawhub install angular📖 About This Skill
name: Angular slug: angular version: 1.0.1 description: Build reliable Angular apps avoiding RxJS leaks, change detection traps, and DI pitfalls.
When to Use
User needs Angular expertise — component architecture, RxJS patterns, change detection, dependency injection, routing, and forms.
Quick Reference
| Topic | File |
|-------|------|
| Components & change detection | components.md |
| RxJS & subscriptions | rxjs.md |
| Forms & validation | forms.md |
| Dependency injection | di.md |
| Routing & guards | routing.md |
| HTTP & interceptors | http.md |
Common Mistakes
OnPush with mutated objects won't trigger change detection — always create new reference: {...obj} or [...arr]@ViewChild is undefined in constructor/ngOnInit — access in ngAfterViewInit or later*ngFor without trackBy re-renders entire list on any change — add trackBy returning stable IDsubscribe() without unsubscribe leaks memory — use async pipe, takeUntilDestroyed(), or unsubscribe in ngOnDestroyHttpClient returns cold Observable — each subscribe() fires new HTTP requestsetTimeout/setInterval outside NgZone — change detection won't run, use NgZone.run() or signalsforwardRef() or restructure servicesElementRef.nativeElement direct DOM access breaks SSR — use Renderer2 or @defersnapshot miss navigation changes — use paramMap Observable for same-component navigationsetValue() on FormGroup requires ALL fields — use patchValue() for partial updates⚡ When to Use
User needs Angular expertise — component architecture, RxJS patterns, change detection, dependency injection, routing, and forms.