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 | INLINECODE0 |
| 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 INLINECODE8 - INLINECODE9 is undefined in constructor/
ngOnInit — access in ngAfterViewInit or later - INLINECODE12 without
trackBy re-renders entire list on any change — add trackBy returning stable ID - Manual
subscribe() without unsubscribe leaks memory — use async pipe, takeUntilDestroyed(), or unsubscribe in INLINECODE18 - INLINECODE19 returns cold Observable — each
subscribe() fires new HTTP request - INLINECODE21 /
setInterval outside NgZone — change detection won't run, use NgZone.run() or signals - Circular DI dependency crashes app — use
forwardRef() or restructure services - INLINECODE25 direct DOM access breaks SSR — use
Renderer2 or INLINECODE27 - Route params via
snapshot miss navigation changes — use paramMap Observable for same-component navigation - INLINECODE30 on FormGroup requires ALL fields — use
patchValue() for partial updates
使用场景
用户需要Angular专业知识——组件架构、RxJS模式、变更检测、依赖注入、路由和表单。
快速参考
| 主题 | 文件 |
|---|
| 组件与变更检测 | components.md |
| RxJS与订阅 |
rxjs.md |
| 表单与验证 | forms.md |
| 依赖注入 | di.md |
| 路由与守卫 | routing.md |
| HTTP与拦截器 | http.md |
常见错误
- - 对已变更对象使用OnPush不会触发变更检测——始终创建新引用:{...obj}或[...arr]
- 在构造函数/ngOnInit中@ViewChild为undefined——应在ngAfterViewInit或之后访问
- 未使用trackBy的*ngFor会在任何变更时重新渲染整个列表——添加返回稳定ID的trackBy
- 手动subscribe()未取消订阅会导致内存泄漏——使用async管道、takeUntilDestroyed()或在ngOnDestroy中取消订阅
- HttpClient返回冷Observable——每次subscribe()都会发起新的HTTP请求
- NgZone外的setTimeout/setInterval——变更检测不会运行,请使用NgZone.run()或信号
- 循环DI依赖会导致应用崩溃——使用forwardRef()或重构服务
- 通过ElementRef.nativeElement直接操作DOM会破坏SSR——使用Renderer2或@defer
- 通过snapshot获取路由参数会遗漏导航变更——对同组件导航使用paramMap Observable
- 对FormGroup使用setValue()需要提供所有字段——部分更新请使用patchValue()