Angular Interview Learning Path

Angular, TypeScript, components, dependency injection, routing, forms, HTTP, RxJS, Signals, NgRx, state management, change detection, performance, security, testing, enterprise architecture, and senior interview questions.

Use this page as the ordered roadmap. Work through each group in sequence — fundamentals first, then implementation topics, then advanced patterns, and finish with interview practice.

Track Navigation

Parent: Frontend Interview

---

Group 1 — Foundations

Angular fundamentals, architecture overview, CLI, project structure, TypeScript basics, bootstrap process, and the module vs standalone model.

#	Topic	What To Focus On
01	What Is Angular	What Angular is, why it exists, how it differs from React and Vue, and its key use cases.
02	Angular Architecture	Modules, components, services, DI system, and how each part fits together.
03	Angular CLI	Creating projects, generating files, building, serving, linting, and testing via CLI.
04	Project Structure	Folder layout, app module, environments, assets, and how to organise a real project.
05	TypeScript for Angular	Types, interfaces, decorators, generics, and TypeScript patterns specific to Angular.
06	Bootstrap Process	How Angular loads from main.ts through AppModule to the first rendered view.
07	main.ts Explained	The entry point, platformBrowserDynamic, bootstrapModule, and standalone bootstrap.
08	App Module vs Standalone Components	NgModule model vs standalone components — when to use each in Angular 14+.
09	Angular Lifecycle Overview	The full component lifecycle from creation to destruction.
10	Top 50 Beginner Questions	Practice the most common beginner-level Angular interview questions.

---

Group 2 — Components

Component creation, lifecycle hooks, communication patterns, view encapsulation, and best practices.

#	Topic	What To Focus On
11	Angular Components	Component anatomy, selectors, metadata, templates, and styles.
12	Lifecycle Hooks	ngOnInit, ngOnChanges, ngOnDestroy, and when each hook fires.
13	Component Communication	@Input, @Output, EventEmitter, services, and signals for parent–child data flow.
14	Input / Output Decorators	Property binding, event binding, aliasing, and the new signal-based input model.
15	ViewChild / ContentChild	Accessing child components and DOM elements, ContentChild, ContentChildren.
16	Template Reference Variables	#ref syntax, using template variables in templates and components.
17	HostBinding / HostListener	Modifying the host element from a component or directive.
18	Dynamic Component Loading	ViewContainerRef, createComponent, and dynamic rendering patterns.
19	Smart vs Dumb Components	Presentational vs container components and the benefits of separation.
20	Component Best Practices	Naming, size limits, one responsibility, and production-quality component design.

---

Group 3 — Templates and Directives

Data binding, structural and attribute directives, pipes, and template performance.

#	Topic	What To Focus On
21	Interpolation vs Property Binding	{{ }} vs [property], when to use each, and security implications.
22	Event Binding	(event) syntax, $event, and handling DOM events in templates.
23	Two-Way Binding	[(ngModel)], banana-in-a-box syntax, and forms integration.
24	NgIf / NgFor / NgSwitch	Classic structural directives, ng-template, trackBy, and async pipe.
25	New Control Flow	Angular 17+ @if, @for, @switch block syntax replacing classic directives.
26	Pipes	Built-in pipes — date, currency, async, json — and when to use them.
27	Custom Pipes	@Pipe decorator, PipeTransform, pure vs impure pipes.
28	Attribute vs Structural Directives	Differences, use cases, and when to write a custom directive.
29	Custom Directives	@Directive, ElementRef, Renderer2, and building reusable DOM behaviour.
30	Template Performance	trackBy, pure pipes, async pipe, and avoiding expensive template expressions.

---

Group 4 — Dependency Injection and Services

Angular's DI system, injector hierarchy, providers, tokens, and service patterns.

#	Topic	What To Focus On
31	Dependency Injection	DI fundamentals, @Injectable, injecting services into components.
32	Injector Hierarchy	Root, module, component, and element injectors — scope and resolution order.
33	Providers	useClass, useValue, useExisting, useFactory provider types.
34	InjectionToken	Providing non-class dependencies safely using InjectionToken.
35	ProvidedIn Root	Tree-shakeable services, providedIn: 'root' vs module providers.
36	Factory Providers	useFactory with deps for dynamic service creation.
37	Multi Providers	multi: true for building plugin-style extension points.
38	DI Best Practices	Scoping, avoiding circular deps, testing DI, and clean service design.
39	Angular Services	Service responsibilities, state, HTTP calls, and business logic patterns.
40	Singleton Services	Ensuring one instance, global state, and avoiding accidental multi-instantiation.
41	Service vs Component	What belongs in a service vs a component, and separation of concerns.
42	Shared Services	Cross-module service sharing, SharedModule, and standalone provider patterns.
43	State Management Basics	Service-based state, BehaviorSubject, and when to add a dedicated store.

---

Group 5 — Routing

Angular Router, lazy loading, guards, resolvers, and routing best practices.

#	Topic	What To Focus On
44	Angular Routing	RouterModule, route configuration, router-outlet, and navigation.
45	Lazy Loading	loadChildren, loadComponent, code-splitting, and bundle impact.
46	Route Guards	canActivate, canDeactivate, canMatch, and functional guards.
47	Resolvers	Pre-fetching data before route activation with ResolveFn.
48	Child Routes	Nested routes, named outlets, and shared layout components.
49	Route Parameters	ActivatedRoute, params, queryParams, and snapshot vs observable.
50	Router Events	NavigationStart, NavigationEnd, global loading indicators.
51	Standalone Routing	provideRouter, bootstrapApplication, and routing without NgModule.
52	Routing Best Practices	Naming conventions, lazy defaults, preloading strategies, and guards.

---

Group 6 — Forms

Template-driven and reactive forms, validation, dynamic forms, and form patterns.

#	Topic	What To Focus On
53	Template-Driven Forms	ngModel, NgForm, ngSubmit, and two-way binding in forms.
54	Reactive Forms	FormGroup, FormControl, FormArray, and the reactive model.
55	FormBuilder	Using FormBuilder to simplify reactive form creation.
56	Custom Validators	ValidatorFn, cross-field validators, and reusable validation logic.
57	Async Validators	AsyncValidatorFn, server-side validation, debouncing, and loading state.
58	Dynamic Forms	Building forms from a configuration object at runtime.
59	FormArray	Dynamic lists, adding/removing controls, and iterating FormArray in templates.
60	Forms Best Practices	Choosing reactive over template-driven, accessibility, and error display patterns.

---

Group 7 — HTTP and API Integration

HttpClient, interceptors, error handling, authentication, caching, and API security.

#	Topic	What To Focus On
61	HttpClient	HttpClientModule, get/post/put/delete, typed responses, and headers.
62	REST API Integration	Consuming REST APIs, mapping responses, and handling pagination.
63	HTTP Interceptors	HttpInterceptorFn, auth tokens, logging, and request/response transforms.
64	Error Handling	catchError, global error handling, user-facing error messages.
65	Retry and Timeout	retry, retryWhen, timeout, and resilient HTTP patterns.
66	Authentication with JWT	Storing tokens, attaching to requests, refresh token flows.
67	File Upload	FormData, multipart uploads, progress events, and drag-and-drop.
68	HTTP Caching	In-memory caching, cache interceptors, and stale-while-revalidate patterns.
69	API Security	CORS, HTTPS, token expiry, and securing API calls from Angular.

---

Group 8 — RxJS

Observables, subjects, operators, error handling, and reactive patterns in Angular.

#	Topic	What To Focus On
70	RxJS Basics	Observable, Observer, Subscription, of, from, interval.
71	Observable vs Promise	Key differences, cancellation, lazy vs eager, and when to prefer each.
72	Subjects	Subject, hot vs cold observables, multicasting patterns.
73	BehaviorSubject	Current-value semantics, state stores, and late subscriber behaviour.
74	ReplaySubject	Buffering past values and use cases for replaying to new subscribers.
75	AsyncSubject	Last-value-on-complete semantics and when to use it.
76	RxJS Operators	map, filter, tap, take, debounceTime, distinctUntilChanged.
77	SwitchMap vs MergeMap vs ConcatMap vs ExhaustMap	Higher-order mapping operators and which to use for search, upload, and form save.
78	Error Handling in RxJS	catchError, throwError, finalize, and recovery strategies.
79	RxJS Best Practices	Unsubscribing, takeUntilDestroyed, avoiding nested subscribes, and memory leaks.

---

Group 9 — Angular Signals

Signal primitives, computed signals, effects, signal-based components, and the future of reactivity.

#	Topic	What To Focus On
80	Angular Signals	signal(), set, update, mutate, and reading signal values.
81	Signal vs RxJS	When to use signals, when to use RxJS, and toSignal / toObservable.
82	Computed Signals	computed(), lazy evaluation, dependency tracking, and memoisation.
83	Effect	effect(), side effects that react to signal changes, and cleanup.
84	Linked Signals	linkedSignal() for derived writable state.
85	Signal Inputs	input() and input.required() as a type-safe replacement for @Input.
86	Signal-Based Components	Zone-free components, outputFromObservable, and the new component model.
87	Signals Best Practices	When to adopt signals, migration from RxJS state, and patterns to avoid.

---

Group 10 — Change Detection and Performance

Change detection strategies, Zone.js, zoneless Angular, and performance tuning.

#	Topic	What To Focus On
88	Change Detection	Default CD cycle, zone, dirty marking, and how Angular knows when to update.
89	Default vs OnPush	ChangeDetectionStrategy.OnPush — when to use it and what it breaks.
90	Zone.js	What Zone.js does, how it patches async, and its role in CD.
91	Zoneless Angular	Running Angular without Zone.js, provideExperimentalZonelessChangeDetection.
92	Performance Optimization	OnPush, pure pipes, trackBy, memoisation, and avoiding re-renders.
93	TrackBy	trackBy in @for and NgFor to avoid unnecessary DOM re-creation.
94	Defer Views	@defer blocks — lazy rendering, trigger conditions, and placeholder templates.
95	Virtual Scrolling	CDK ScrollingModule, large-list rendering, and fixed vs variable item sizes.

---

Group 11 — State Management

NgRx, store, actions, reducers, effects, selectors, NgRx Entity, SignalStore, and comparison of libraries.

#	Topic	What To Focus On
96	NgRx	NgRx overview, Redux pattern, when to use a store vs services.
97	NgRx Store	StoreModule.forRoot, state shape, Store injection, and select.
98	Actions, Reducers, Effects	createAction, createReducer, createEffect, and the unidirectional data flow.
99	Selectors	createSelector, createFeatureSelector, memoisation, and selector composition.
100	NgRx Entity	EntityState, EntityAdapter, CRUD operations in reducers.
101	SignalStore	NgRx SignalStore, signalStore, withState, withComputed, withMethods.
102	NGXS vs NgRx vs Akita	Comparing state libraries — boilerplate, learning curve, and when to pick each.

---

Group 12 — Security

Angular security model, XSS, CSRF, DomSanitizer, JWT, and OWASP for Angular.

#	Topic	What To Focus On
103	Angular Security	Angular's built-in security context, auto-escaping, and trusted types.
104	XSS Protection	How Angular prevents XSS, bypassSecurityTrust*, and safe patterns.
105	CSRF Protection	SameSite cookies, CSRF tokens, and Angular's HttpClientXsrfModule.
106	DomSanitizer	SecurityContext, sanitizing HTML, URLs, and style values safely.
107	JWT Security	Storing JWTs securely, httpOnly cookies, refresh tokens, and XSS risk.
108	OWASP Angular	OWASP Top 10 mapped to Angular — injection, broken auth, and misconfiguration.

---

Group 13 — Testing

Unit testing with Jasmine/Karma/Jest, component testing, service testing, HTTP testing, and E2E.

#	Topic	What To Focus On
109	Unit Testing	TestBed, ComponentFixture, debugElement, and the Angular test setup.
110	Jasmine	describe, it, expect, spies, beforeEach, and matchers.
111	Karma	Karma configuration, browser launchers, and CI integration.
112	Jest	Replacing Karma with Jest, jest-preset-angular, snapshot testing.
113	Component Testing	Shallow vs deep rendering, NO_ERRORS_SCHEMA, and input/output testing.
114	Service Testing	Injecting services, mocking dependencies, and testing observables.
115	HTTP Testing	HttpClientTestingModule, HttpTestingController, and mocking API calls.
116	E2E Testing	End-to-end test strategy, page objects, and what to cover in E2E.
117	Cypress	Cypress setup, Angular integration, commands, and component testing.
118	Playwright	Playwright for Angular, auto-waits, and multi-browser E2E testing.

---

Group 14 — Enterprise Architecture

Feature modules, microfrontends, monorepo with Nx, Module Federation, clean architecture, and scalable structure.

#	Topic	What To Focus On
119	Angular Architecture	Core/shared/feature module pattern, domain separation, and layering.
120	Feature Modules	Encapsulating features, lazy-loaded feature modules, and barrel files.
121	Microfrontends	Microfrontend patterns with Angular — shell app, remote apps, and integration.
122	Monorepo with Nx	Nx workspaces, project graph, code sharing, and build caching.
123	Module Federation	Webpack Module Federation, dynamic remotes, and shared singletons.
124	Shared Libraries	Building reusable Angular libraries in an Nx monorepo.
125	Clean Architecture	Domain layer, use cases, adapters, and keeping Angular out of business logic.
126	Enterprise Best Practices	Linting, enforced boundaries, code review, and team-scale conventions.
127	Scalable Folder Structure	Organising large Angular apps — by feature, by type, and hybrid approaches.

---

Group 15 — Modern Angular and Production

Angular 17–19 features, SSR, hydration, build system, performance delivery, and deployment.

#	Topic	What To Focus On
128	Production Deployment	ng build, production flags, environment configs, Docker, and CI/CD.
129	Lazy Loading Performance	Route-level and component-level lazy loading for bundle size reduction.
130	Bundle Optimization	Source maps, budget limits, ng-build analysis, and reducing initial load.
131	Tree Shaking	How tree shaking works, dead code elimination, and sideEffects.
132	AOT vs JIT	Ahead-of-time vs just-in-time compilation — performance and production impact.
133	SSR vs CSR	When to use Angular Universal / SSR vs pure client-side rendering.
134	Hydration	Non-destructive hydration in Angular 16+, how it works, and pitfalls.
135	Image Optimization	NgOptimizedImage, lazy loading images, and Core Web Vitals impact.
136	Core Web Vitals	LCP, FID, CLS — what they measure and how Angular decisions affect them.
137	New Control Flow	@if, @for, @switch — Angular 17 template syntax and migration path.
138	Defer Blocks	@defer triggers — on idle, on viewport, on interaction, when.
139	Standalone Applications	Fully standalone apps — no AppModule, bootstrapApplication, providers.
140	SSR and Hydration	Full SSR + hydration setup, provideClientHydration, and edge-case handling.
141	New Build System	Vite-based build, esbuild, application builder, and speed improvements.
142	Signal-Based Components	Fully reactive components using signals, computed, and effect — no Zone needed.
143	Future of Angular	Angular roadmap, Signals direction, zoneless default, and what to prepare for.

---

Group 16 — Senior Interview Practice

Scenario-based, real-project, debugging, performance, architecture, and system design interview questions.

#	Topic	What To Focus On
144	Scenario-Based Interview	Real-world Angular problems — design decisions, tradeoffs, and production war stories.
145	Real-Time Project Interview	Questions drawn from actual production Angular projects.
146	Debugging Interview	Diagnosing change detection, memory leaks, broken subscriptions, and slow renders.
147	Performance Tuning Interview	Profiling, reducing bundle size, fixing slow lists, and Core Web Vitals remediation.
148	Architecture Interview	Module design, state strategy, scalability, team conventions, and technical decisions.
149	Production Issues	Memory leaks, hydration failures, broken lazy loading, and deployment problems.
150	System Design with Angular	Designing real applications — e-commerce, dashboards, banking portals with Angular.

---

How To Study

1. Work through each group in order — do not skip foundations even if you are experienced.
2. For each topic, write a two-sentence verbal explanation before moving on.
3. Connect every concept to a real production example — app you have built or can describe.
4. After each group, revisit any topic you could not explain without reading.
5. Use the senior interview practice group as your final preparation, not a shortcut.

Completion Checklist

• Explain every group topic without reading notes.
• Know at least one production mistake or tradeoff per topic.
• Can answer beginner, mid-level, senior, and architect follow-ups on any topic.
• Understand how each group connects to the others — DI feeds services, services feed state, state feeds components.

Continue Learning

Parent: Frontend Interview