Angular Developer interview questions
100 real questions with model answers and explanations for Angular Developer candidates.
See a Angular Developer resume example →Practice with flashcards
Spaced repetition · Hunter Pass
Questions
The map operator synchronously transforms each emitted value into another value.
- It preserves the number and order of source emissions while changing their shape.
- Its projection should return plain values, not subscribe to another Observable.
- Use a flattening operator such as switchMap when the transformation returns an Observable.
Why interviewers ask this: The interviewer is checking whether the candidate distinguishes value transformation from higher-order Observable handling.
switchMap subscribes to the newest inner Observable and unsubscribes from the previous one.
- Each source emission is projected into a new inner Observable.
- Cancellation makes it suitable for typeahead searches and route-driven requests.
- It is unsuitable when every inner operation must finish, because earlier work can be discarded.
Why interviewers ask this: A strong answer explains both the cancellation semantics and the kind of work for which they are safe.
mergeMap keeps multiple inner subscriptions active, while switchMap retains only the latest one.
- mergeMap allows results to arrive in a different order from source emissions.
- Its concurrency parameter can limit how many inner operations run at once.
- Choose it when all independent operations must complete and cancellation would lose work.
Why interviewers ask this: The interviewer is evaluating whether the candidate can select a flattening operator from its concurrency semantics.
concatMap queues inner Observables and processes them one at a time in source order.
- The next inner subscription starts only after the current one completes.
- It preserves ordering for operations such as sequential updates.
- A slow or non-completing inner Observable blocks every item behind it.
Why interviewers ask this: The question tests understanding of ordered serialization and its throughput cost.
combineLatest emits the latest value from every input whenever any input emits after all have emitted once.
- It waits until each input has produced an initial value.
- After initialization, one changed input causes a new combined emission.
- It suits continuously changing inputs such as filters, pagination, and user settings.
Why interviewers ask this: The interviewer wants the candidate to understand initialization and ongoing emission behavior, not just the operator name.
combineLatest produces ongoing combinations, while forkJoin emits once after every input completes.
- combineLatest reacts repeatedly to new values after all sources initialize.
- forkJoin returns the last value from each source and then completes.
- forkJoin never emits if an input never completes and normally fails if any input errors.
Why interviewers ask this: A strong answer matches each combinator to continuous state or one-time completion.
A BehaviorSubject stores a current value, while a Subject only forwards emissions that occur after subscription.
- BehaviorSubject requires an initial value and immediately sends the latest value to a new subscriber.
- Subject has no current-value API and late subscribers miss earlier emissions.
- BehaviorSubject is useful for simple shared state, while Subject fits event-like notifications.
Why interviewers ask this: The interviewer is checking whether the candidate understands replay behavior and appropriate state versus event usage.
A cold Observable creates its producer per subscriber, while a hot Observable shares an existing producer.
- HttpClient Observables are cold, so separate subscriptions usually trigger separate requests.
- Subjects and DOM event streams are commonly hot because subscribers observe one shared source.
- Operators such as share can multicast a cold source when shared execution is intended.
Why interviewers ask this: The question evaluates whether the candidate can reason about duplicated work and shared producers.
catchError should be placed at the boundary whose failure you intend to recover from.
- Inside switchMap, it can recover one inner request while keeping the outer stream alive.
- Outside switchMap, an unhandled inner error terminates the whole composed stream.
- The callback must return an Observable, such as of for a fallback or throwError to rethrow.
Why interviewers ask this: The interviewer is testing knowledge of Observable termination and the effect of operator placement.
retry resubscribes after failure, while finalize runs cleanup when a subscription ends for any reason.
- retry repeats the source, so it can repeat side effects and must be used only when that is safe.
- A retry configuration can limit attempts and delay resubscription.
- finalize runs on completion, error, or unsubscription and is suitable for clearing loading state.
Why interviewers ask this: A strong answer separates retry policy from deterministic cleanup and recognizes repeated side effects.
shareReplay shares one subscription and replays recent values to later subscribers.
- It can prevent duplicate HTTP requests when several consumers need the same result.
- bufferSize controls how many emissions are replayed to late subscribers.
- Use an appropriate refCount and lifetime policy so a long-lived replay buffer does not retain stale data or resources.
Why interviewers ask this: The interviewer is checking whether the candidate understands both multicasting benefits and cache lifetime risks.
Angular components should prefer template or lifecycle-aware subscription mechanisms over unmanaged manual subscriptions.
- The async pipe subscribes and unsubscribes with the view automatically.
- takeUntilDestroyed integrates imperative subscriptions with the component's DestroyRef lifecycle.
- Manual subscriptions must be released, especially for long-lived streams that do not complete themselves.
Why interviewers ask this: The question tests practical knowledge of subscription lifetime without turning into a debugging scenario.
FormBuilder creates FormControl, FormGroup, and FormArray structures with less repetitive setup.
- Its group, control, and array methods keep nested form construction readable.
- NonNullableFormBuilder creates controls whose value types do not include null.
- Typed forms let TypeScript verify control names and value shapes at compile time.
Why interviewers ask this: The interviewer is evaluating familiarity with maintainable and typed reactive-form construction.
Synchronous validators return validation errors immediately or null when the value is valid.
- Built-in validators can be supplied as an array when a control is created.
- A custom ValidatorFn receives an AbstractControl and returns a keyed ValidationErrors object or null.
- The control combines errors from its validators and exposes them through errors and status.
Why interviewers ask this: A strong answer describes the validator contract rather than only naming built-in validators.
An asynchronous validator returns a Promise or Observable that eventually yields validation errors or null.
- Angular runs async validators only after synchronous validation passes and marks the control as PENDING during the check.
- An Observable validator should emit its result and complete so validation can finish.
- Async validators are passed separately from synchronous validators in the control configuration.
Why interviewers ask this: The interviewer is checking the candidate's understanding of the async validator contract and form status.
Cross-field validation belongs on the common FormGroup that contains the related controls.
- The ValidatorFn reads sibling values from the group and returns a group-level error when their relationship is invalid.
- The template can inspect the group's error while deciding which fields should display feedback.
- Keeping the error on the group avoids making one control solely responsible for a relationship.
Why interviewers ask this: The question tests whether the candidate can model validation at the correct level of the form tree.
FormArray represents an ordered collection of controls whose length can change at runtime.
- Each item can be a FormControl, FormGroup, or another FormArray.
- Methods such as push, insert, removeAt, and clear update the collection.
- It fits repeated structures such as addresses or line items where indices are more natural than fixed keys.
Why interviewers ask this: The interviewer is assessing knowledge of dynamic form structure rather than static FormGroup fields.
A dynamic form maps field metadata into controls and renders each supported field type from that metadata.
- The metadata can define the key, initial value, validators, label, and control type.
- A factory converts each definition into a typed control inside a FormGroup or FormArray.
- Rendering logic should use a finite set of known components instead of evaluating arbitrary templates.
Why interviewers ask this: The interviewer is evaluating whether the candidate can separate form schema from rendering without overengineering.
setValue requires the complete group shape, while patchValue updates only the supplied controls.
- setValue throws when required keys are missing or unexpected keys are present.
- patchValue is convenient for partial API payloads but can hide omitted fields.
- Typed forms improve compile-time checking, but the runtime completeness distinction still matters.
Why interviewers ask this: The question checks whether the candidate understands strict versus partial form updates.
updateOn determines when a control updates and validates, while status reports its current validation state.
- The supported update triggers are change, blur, and submit.
- VALID, INVALID, PENDING, and DISABLED describe validation and participation in the parent value.
- A group can define updateOn for descendants unless an individual control overrides it.
Why interviewers ask this: The interviewer is checking knowledge of validation timing and state propagation in reactive forms.
Locked questions
- 21
How do Default and OnPush change detection differ?
change-detection - 22
What events cause an OnPush component to be checked?
components - 23
What role does Zone.js play in Angular change detection?
angularchange-detection - 24
When would you use ChangeDetectorRef methods?
change-detection - 25
Why does immutability work well with OnPush change detection?
change-detectionimmutability - 26
What provider forms does Angular dependency injection support?
angulardependency-injectioninjection - 27
Why is InjectionToken needed?
injection - 28
How do hierarchical injectors resolve a dependency?
dependency-injectiondependencies - 29
How does providedIn root differ from a component provider?
components - 30
What are multi providers used for?
dependency-injection - 31
What are Angular route guards responsible for?
angularrouting - 32
What does a route resolver provide?
routing - 33
How is lazy loading configured in modern Angular routing?
angularlazy-loadingconfig - 34
How do child routes and router outlets work together?
routing - 35
How should components read changing route parameters?
components - 36
Why should a guard return a UrlTree instead of calling navigate and returning false?
routing - 37
What are signal, computed, and effect in Angular?
angularsignals - 38
How should signal values be updated?
signals - 39
How can Angular signals interoperate with RxJS?
angularrxjssignals - 40
What are the core pieces of the NgRx Store pattern?
state-management - 41
What makes a good NgRx reducer and selector?
state-management - 42
What belongs in an NgRx effect?
state-management - 43
When is a service with signals or RxJS preferable to NgRx?
rxjsstate-managementsignals - 44
How does an Angular HTTP interceptor chain work?
angularhttp - 45
What is HttpContext used for in Angular HTTP interceptors?
angularhttp - 46
What are functional HTTP interceptors?
http - 47
How does content projection with ng-content work?
components - 48
How do multiple ng-content slots select projected content?
components - 49
How can a component be created dynamically with ViewContainerRef?
components - 50
When is NgComponentOutlet useful?
components - 51
A product list must react to search text, selected filters, and a route category. How would you build the request flow?
react - 52
Users navigate quickly between /customers/:id pages, and an older response sometimes replaces the current customer. What would you change?
- 53
An editor autosaves every valid draft change, and the backend requires revisions to arrive in order. How would you implement it?
- 54
A checkout button can be clicked repeatedly while payment creation is pending. How do you prevent duplicate submissions?
- 55
A dashboard has profile, alerts, and sales streams that update independently. How would you render a coherent view model?
alerting - 56
Several components request the same lookup data, but the cache must disappear after the feature is no longer used. How would you scope shareReplay?
componentsrxjscaching - 57
An API occasionally returns 503 or times out, but also returns non-retryable 400 responses. How would you add capped backoff?
resilienceapi - 58
One optional dashboard widget fails, and currently the combined dashboard goes blank. How would you isolate the failure?
- 59
A catalog should show cached data immediately and refresh it in the background. How would you implement stale-while-refresh?
caching - 60
An order page should poll status every five seconds only while its route is active. What stream would you build?
- 61
How would you reconnect an Angular WebSocket feed after disconnects without leaving sockets open after navigation?
angularwebsockets - 62
Orders can be loaded only after the account request returns its internal ID. How would you compose these calls?
- 63
A username availability check must wait for typing to pause and cancel obsolete HTTP checks. How would you wire it?
http - 64
A component throws ExpressionChangedAfterItHasBeenCheckedError because a child updates parent-bound state during initialization. How would you fix the design?
componentsdesign - 65
An OnPush child does not update after its parent pushes an item into an input array. What is the correct fix?
- 66
An OnPush component manually subscribes to a service and receives data, but its template stays stale. What would you change?
componentstemplates - 67
A third-party map callback runs outside Angular and changes a signal used by the template, but the UI is not refreshed. How would you integrate it?
angularsignalstemplates - 68
A page feels slow because change detection runs far more often than expected. How would you find the cause?
change-detection - 69
A chart processes mousemove events at 120 Hz, but Angular state changes only when the hovered bucket changes. How would you reduce checks?
angularconcurrency - 70
A pure pipe that filters a product array does not rerun after an item is mutated. What should change?
pipes - 71
A table with 100,000 rows freezes on initial render and when rows update. How would you make it usable?
- 72
The admin area adds a large initial bundle for users who never open it. How would you change routing?
- 73
A reviews section is below the fold and expensive to initialize. How would you use @defer without leaving a blank jump?
- 74
A template calls calculatePrice(item) many times per change-detection cycle. How would you remove the repeated work?
templates - 75
A date library appears in the main bundle even though only a lazy report uses it. How would you find and fix the leak?
- 76
A teammate proposes deferring a product configurator to improve startup. How would you decide whether the change is actually better?
config - 77
A date-range picker is used by one page, while selected workspace data is shared across a feature. Where should each state live?
- 78
Design NgRx state for a server-backed task list filtered by the route. Which actions, selectors, and effect would you use?
state-managementdesign - 79
Users make rapid inline edits that the API must apply in order. How would you model the NgRx effect?
state-managementapi - 80
How would you implement an optimistic NgRx update when several edits to the same item may be in flight?
state-managementlocking - 81
An NgRx feature stores full customer objects inside every order, causing inconsistent duplicates. How would you normalize it?
mlopsnormalizationstate-management - 82
An expensive NgRx selector recomputes on every unrelated state change. How would you restore memoization?
state-managementmemoization - 83
A single component manages selected rows, a text filter, and a derived total. How would you model it with signals?
componentssignals - 84
A component consumes an RxJS query stream as a signal and must expose selected IDs back to an observable API. How would you interoperate safely?
componentsrxjssignals - 85
What focused tests would you write for an NgRx feature with a reducer, selectors, and a load effect?
state-managementtesting - 86
How would you test that an Angular service sends the correct HTTP request and maps its response?
angularhttp - 87
A reactive control shows a validation error 300 ms after typing stops. How would you test the timing deterministically?
reactvalidation - 88
How would you test that an auth guard redirects a signed-out user and allows a signed-in user to reach a protected route?
routing - 89
How would you prove in a component test that an OnPush child updates only after its input reference changes?
components - 90
A reactive checkout form conditionally requires company tax fields. How would you test the behavior with Angular's test stack?
reactformsangular - 91
How would you marble-test a search stream that debounces input and cancels an older HTTP result?
debouncehttp - 92
How would you model an order form with a shipping address and a dynamic list of line items?
forms - 93
A registration form must reject mismatched passwords and check email uniqueness on the server. Where would validators go?
passwordsvalidationforms - 94
A VAT number is required only when the customer selects Business. How would you update validators at runtime?
validation - 95
An expensive async validator should run only after the user leaves the email field. How would you configure it?
validationasyncconfig - 96
How would you implement a custom date-range control that works correctly when disabled and touched?
- 97
How would you persist a reactive form draft and restore it without triggering another save?
reactforms - 98
Profile data arrives after a user has already edited part of the form. How would you fill untouched fields without overwriting their work?
forms - 99
A root service exposes shareReplay(1) over a never-ending source, and memory remains after every consumer closes. How would you fix ownership and teardown?
ownershipmemoryrxjs - 100
A component starts a timer, registers a window listener, opens a WebSocket, and switchMaps to inner streams. How would you guarantee complete cleanup?
componentsrxjswebsockets