Angular Interview Questions and Answers

Answer: A TypeScript-based web application framework

Angular is a TypeScript-based open-source web application framework developed and maintained by Google. It is used for building single-page applications (SPAs).

Answer: Both b and c

Angular Router enables navigation between views/components in a single-page application. It maps URL paths to components and manages navigation history.

Answer: Both b and c

NgRx is a state management library that implements the Redux pattern using RxJS. It provides a single source of truth for application state.

Answer: All of the above

Routes are defined as an array of Route objects in the routing module. Each route specifies a path and the component to display.

Answer: ng new

`ng new project-name` creates a new Angular project with the default configuration, including all necessary files and dependencies.

Answer: All of the above

NgRx core concepts: Store (single state tree), Actions (events), Reducers (pure functions), Effects (side effects), Selectors (state queries).

Answer: All of the above

Components are the fundamental building blocks of Angular applications. Each component consists of a TypeScript class, HTML template, and CSS styles.

Answer: All of the above

Custom directives allow you to extend HTML with custom behavior. Types: Structural (change DOM layout like *ngIf) and Attribute (change appearance/behavior).

Answer: Both b and c

<router-outlet> is a directive that acts as a placeholder where the router should display the routed component based on the current URL.

Answer: @Component

The @Component decorator marks a class as an Angular component and provides metadata like selector, template, and styles.

Answer: Both b and c

routerLink is used for navigation between views without full page reload. It generates the appropriate href and handles navigation.

Answer: Both b and c

@HostListener listens to DOM events on the host element. @HostBinding binds host element properties or attributes. Both are used in directives.

Answer: Both b and c

Angular Universal enables server-side rendering, generating HTML on the server before sending to client. Improves SEO, initial load time, and social media sharing.

Answer: Synchronization between model and view

Data binding is a mechanism for coordinating parts of a template with parts of a component. Angular supports one-way and two-way data binding.

Answer: Both b and c

Route parameters are dynamic parts of the URL path. Defined with colon syntax (:id) and accessed via ActivatedRoute service.

Answer: Both b and c

Template-driven forms rely on directives in template (ngModel). Reactive forms define form structure in component code, offering better scalability and testability.

Answer: {{ }}

Double curly braces {{ }} are used for interpolation in Angular templates to display component property values in the view.

Answer: Both b and c

AOT compiles templates and components during build time (before browser downloads code). Results in faster rendering, better security, and smaller bundle size.

Answer: All of the above

Reactive forms use FormGroup (group of controls), FormControl (individual field), and FormBuilder (service to easily create forms).

Answer: Both b and c

ngModel creates two-way data binding between form inputs and component properties. It requires FormsModule to be imported.

Answer: All of the above

JIT compiles the application in the browser at runtime. Slower initial load but useful during development for faster builds. AOT is preferred for production.

Answer: Both b and c

Tree shaking removes unused code from the final bundle during the build process, reducing bundle size. It works with ES6 module imports.

Answer: All of the above

HttpClient is a service for making HTTP requests to APIs. It returns RxJS Observables and requires HttpClientModule to be imported.

Answer: Both b and c

NgModules are containers that group related components, directives, pipes, and services. Every Angular app has at least one module, the root module (AppModule).