# TypeScript + Angular Code Review Review {{input}} for code quality, correctness, and best practices. ## TypeScript - Avoid `any`; use strict mode (`"strict": true` in tsconfig) - Type all `@Input()` and `@Output()` decorators explicitly - Use readonly where component inputs should not be mutated internally ## Angular Architecture - Use `OnPush` change detection on all components that receive data via `@Input()` — it improves performance significantly - Inject services via the constructor or `inject()`; avoid accessing them via `this` in templates - Prefer smart/dumb component split: smart components fetch data; dumb components render it - Lazy-load feature modules using `loadChildren` to keep the initial bundle small ## RxJS / Subscriptions - Every `subscribe()` must have a corresponding unsubscribe to prevent memory leaks — use `takeUntilDestroyed()` or the `async` pipe - Prefer the `async` pipe in templates over manual subscriptions in the component class - Avoid nested subscriptions (`subscribe` inside `subscribe`) — use `switchMap`, `mergeMap`, or `combineLatest` - Handle errors in observable chains with `catchError`; never let unhandled errors silently terminate a stream ## Forms - Prefer reactive forms over template-driven forms for complex or dynamic forms - Validate at the form control level, not just on submit - Sanitise user input before sending to the server ## Security - Use Angular's built-in sanitisation; never bypass it with `bypassSecurityTrust*` without explicit need - No secrets or API keys in client-side code or environment files committed to source control - Validate all data from HTTP responses before binding to the template ## Code Quality - Components should do one thing; extract logic into services or pipes - Tests with TestBed; cover template interactions and service integration --- List findings as **Critical** (security/memory leaks/crashes) -> **Major** (bugs/subscription leaks/wrong change detection) -> **Minor** (performance/style). Cite each location and suggest the concrete fix.