Entry Angular Interview Questions

Angular is a TypeScript-based front-end framework developed and maintained by Google.
It is used to build single-page applications (SPA) and large-scale web applications.

It provides features like components, modules, routing, two-way data binding, dependency injection, and built-in tooling through Angular CLI.

Angular is a TypeScript-based front-end framework for building scalable and maintainable web applications. It provides components, routing, forms, HTTP, and strong structure for enterprise-level apps.

It is used because it offers TypeScript support, component architecture, built-in tooling, and a complete ecosystem for developing large applications.

Components are the smallest UI building blocks in Angular. They include a template (HTML), a class (TypeScript), and metadata.

Components help create modular, reusable, and structured user interfaces.

Angular modules (NgModules) group related components, directives, pipes, and services.

They organize app features, enable lazy loading, and manage visibility of components.

Data binding connects the component class and the template.

Types include interpolation, property binding, event binding, and two-way binding.

Directives are instructions applied to DOM elements.

Types include structural directives (*ngIf, *ngFor) and attribute directives (ngClass, ngStyle).

Dependency Injection provides required services to components automatically.

It improves testability, reduces coupling, and organizes application logic.

Lifecycle hooks allow running code at specific moments such as initialization, change detection, and destruction.

Important hooks include ngOnInit, ngOnDestroy, and ngOnChanges.

Change detection updates the view automatically when component data changes.

Angular uses Zone.js to track async events and re-render components when needed.

Angular CLI is a command-line tool used to create projects, generate components, run builds, and perform testing.

It standardizes development and improves productivity.

AOT compiles Angular templates during the build process instead of in the browser.

It produces faster load times, smaller bundles, and more secure applications compared to JIT compilation.

Pipes are data transformation tools used inside Angular templates. They take input data, apply formatting, and return a transformed output.

Common uses include formatting dates, numbers, currency, converting text case, and filtering lists. Angular supports pure and impure pipes depending on performance and data needs.

Services contain shared or reusable logic that should not be placed inside components.

They are commonly used for HTTP calls, state management, business logic, utilities, and data sharing. Angular services work with Dependency Injection for clean structure and testability.

Observables represent asynchronous or event-based data streams. Angular uses RxJS Observables for HTTP requests, user inputs, route events, and real-time updates.

Observables support cancelling, multiple values, and powerful operators, making them ideal for reactive UI development.

Angular Routing enables navigation between components based on the URL. It maps paths to components and allows navigation without page reload.

It supports route parameters, query parameters, guards, and lazy loading, enabling SPA behavior.

Route guards control whether navigation to a route should be allowed or blocked.

Common guards include CanActivate, CanDeactivate, Resolve, CanLoad, and CanActivateChild. They are used for authentication, authorization, saving unsaved data, and preloading route data.

Lazy loading loads modules only when they are needed, not on initial app startup.

It improves performance by reducing initial bundle size and enables scalable enterprise-level application development.

Template-driven forms rely mainly on HTML templates and are suitable for simple forms.

Reactive forms place form logic in the component class, offering more control, better validation, and integration with RxJS—ideal for complex and dynamic forms.

Zones track asynchronous operations and notify Angular when to run change detection.

They eliminate the need to manually update the UI after async tasks, simplifying app development.

OnPush change detection checks a component only when its input reference changes, an event occurs, or an observable emits.

It improves performance in large, data-heavy applications by reducing unnecessary change detection cycles.

ViewChild allows a component to access child components, DOM elements, or directives.

It is useful for calling child methods, reading template references, and interacting with the DOM after view initialization.