🤖
Angular
Avoid common Angular mistakes — subscription leaks, change detection, dependency injection, and module organization.
安全通过
技能说明
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
OnPushwith mutated objects won't trigger change detection — always create new reference:{...obj}or[...arr]@ViewChildis undefined in constructor/ngOnInit— access inngAfterViewInitor later*ngForwithouttrackByre-renders entire list on any change — addtrackByreturning stable ID- Manual
subscribe()without unsubscribe leaks memory — useasyncpipe,takeUntilDestroyed(), or unsubscribe inngOnDestroy HttpClientreturns cold Observable — eachsubscribe()fires new HTTP requestsetTimeout/setIntervaloutside NgZone — change detection won't run, useNgZone.run()or signals- Circular DI dependency crashes app — use
forwardRef()or restructure services ElementRef.nativeElementdirect DOM access breaks SSR — useRenderer2or@defer- Route params via
snapshotmiss navigation changes — useparamMapObservable for same-component navigation setValue()on FormGroup requires ALL fields — usepatchValue()for partial updates
如何使用「Angular」?
- 打开小龙虾AI(Web 或 iOS App)
- 点击上方「立即使用」按钮,或在对话框中输入任务描述
- 小龙虾AI 会自动匹配并调用「Angular」技能完成任务
- 结果即时呈现,支持继续对话优化