Question 1

What is an Angular component and what are its core pieces?

Accepted Answer

A component is a class with a template and styles that owns a piece of UI, declared with @Component. Angular components encapsulate view + logic. The decorator sets selector, template/templateUrl, styleUrls, and changeDetection. The class holds state and methods; the template binds to them. Standalone components import their own dependencies instead of needing NgModules.

Question 2

What is the difference between a standalone component and an NgModule-declared component?

Accepted Answer

Standalone components declare imports in @Component; classic components are declared in an NgModule. Standalone (default in modern Angular) makes components self-contained and simplifies lazy loading. NgModules still exist for legacy apps and some libraries. Prefer standalone for new work; migrate gradually with standalone: true.

Question 3

Explain @Input and @Output on Angular components.

Accepted Answer

@Input receives data from the parent; @Output emits events via EventEmitter (or output() function). Inputs are one-way down; outputs notify parents of events. Prefer the signal-based input()/output() APIs in modern Angular. Avoid two-way binding unless needed; use model() for two-way signal inputs.

Question 4

What is content projection and when do you use ng-content?

Accepted Answer

Content projection slots parent-provided markup into a child template via ng-content. Use select to project into multiple slots. Prefer projection for reusable shells (cards, layouts) instead of hardcoding children. Distinguish projected content from the component's own view for styling and queries.

Question 5

How do ViewChild and ContentChild differ?

Accepted Answer

ViewChild queries the component's own template; ContentChild queries projected content. Timing matters: queries are available after ngAfterViewInit / ngAfterContentInit. Prefer signal queries (viewChild, contentChild) in modern Angular. Avoid querying too early in the constructor.

Question 6

What lifecycle hooks matter most for Angular components?

Accepted Answer

ngOnInit for setup, ngOnDestroy for cleanup; view/content hooks when querying DOM/projected nodes. Constructor is for DI only. Use effects/signals for reactive updates instead of heavy ngOnChanges when possible. Always unsubscribe or destroy resources in ngOnDestroy (or takeUntilDestroyed).

Question 7

When should you split a large component into smaller ones?

Accepted Answer

When the template/logic mixes unrelated concerns, re-renders are expensive, or reuse/testing suffers. Extract presentational components, move state to services or parent containers, and keep templates readable. Prefer composition over inheritance for UI.

Question 8

How do you share state between sibling Angular components?

Accepted Answer

Lift state to a common parent, use a shared injectable service, or a signal store. Avoid prop drilling through deep trees. Services with providedIn or route-level providers scope lifetime. Signals/RxJS subjects expose reactive state.

Question 9

What template syntax does Angular use for binding?

Accepted Answer

Interpolation {{ }}, property [prop], event (event), and two-way [(ngModel)] or [()] for bananas-in-a-box. Prefer one-way data flow. Use attribute binding [attr.x] when needed. Event bindings pass $event. Avoid complex expressions in templates—move logic to the class or pipes/computed signals.

Question 10

What is the difference between *ngIf and @if in Angular templates?

Accepted Answer

@if is the built-in control flow; *ngIf is the structural directive from CommonModule. Built-in @if/@for/@switch are preferred in modern Angular: better type narrowing, no NgIf import, and clearer syntax. *ngIf still works for older codebases.

Question 11

How does @for track items and why does track matter?

Accepted Answer

@for requires a track expression to identify items across updates for efficient DOM reuse. Tracking by identity (id) prevents destroying/recreating DOM when the list reorders. track $index is a last resort. Wrong track keys cause state bugs in inputs inside lists.

Question 12

What are template reference variables?

Accepted Answer

Local names (#ref) that point to a DOM element or directive/component instance in the template. Useful for focusing inputs or reading child APIs. Prefer ViewChild for class access. Don't overuse refs for state that belongs in the component model.

Question 13

When should you use a pipe vs a method in a template?

Accepted Answer

Pipes (especially pure) are for transform display; avoid calling heavy methods every CD cycle. Pure pipes cache by reference/args. Methods in templates re-run on every change detection. Prefer computed signals for derived view state in modern apps.

Question 14

How do you safely bind HTML in Angular templates?

Accepted Answer

Use [innerHTML] only with DomSanitizer after trusting content, or prefer text interpolation. Angular sanitizes by default against XSS. bypassSecurityTrustHtml is dangerous—only for trusted CMS content. Prefer markdown renderers with sanitization.

Question 15

What is ng-template and how does it differ from ng-container?

Accepted Answer

ng-template is an inert template definition; ng-container groups without a DOM element. ng-template content renders only when stamped (ngIf else, ngTemplateOutlet). ng-container is for structural directives without extra wrappers. Don't confuse with <template> HTML element semantics alone.

Angular Interview Questions & Answers

Angular interview topics

All Angular interview questions

Components interview questions

Templates interview questions

Dependency Injection interview questions

Change Detection interview questions

Signals interview questions

RxJS interview questions

Routing interview questions

Forms interview questions

HTTP interview questions

Guards interview questions

Interceptors interview questions

Performance interview questions

SSR interview questions

Hydration interview questions

Zoneless Angular interview questions

Architecture interview questions

Testing interview questions

Security interview questions