16. What is the role of NgModule in Angular?
NgModule is a decorator that defines a module in Angular. It organizes components, directives, pipes, and services into cohesive blocks and helps with lazy loading and dependency injection.
17. What is the difference between Template-driven and Reactive forms?
Template-driven forms are easier to use and rely on directives in the template, while Reactive forms offer more control, scalability, and testability using explicit form models in TypeScript.
18. What is the purpose of lifecycle hooks in Angular?
Lifecycle hooks allow developers to tap into key moments of a component’s life, such as initialization, change detection, and destruction. Common hooks include ngOnInit, ngOnChanges, and ngOnDestroy.
19. What is ViewChild in Angular?
@ViewChild is a decorator that allows access to a child component, directive, or DOM element from the parent component class, enabling direct interaction with its properties and methods.
20. What is the difference between ngOnInit and constructor?
The constructor is used for dependency injection and class setup, while ngOnInit is a lifecycle hook that runs after the component is initialized and the inputs are set.
21. What is the async pipe in Angular?
The async pipe subscribes to Observables or Promises and returns the latest value. It also handles unsubscription automatically, reducing memory leaks.
22. What is the difference between pure and impure pipes?
Pure pipes execute only when the input changes, improving performance. Impure pipes run on every change detection cycle and are used when inputs are complex or mutable.
23. What is Ahead-of-Time (AOT) compilation?
AOT compiles Angular HTML and TypeScript code into efficient JavaScript during the build process, reducing runtime errors and improving performance.
24. What is lazy loading in Angular?
Lazy loading loads feature modules only when needed, reducing initial load time and improving performance. It’s configured using the Angular Router.
25. What is the role of RxJS in Angular?
RxJS (Reactive Extensions for JavaScript) provides tools for reactive programming using Observables. Angular uses RxJS for handling asynchronous operations like HTTP requests and event streams.
26. How do you handle errors in Angular applications?
Errors can be handled using try-catch blocks, catchError from RxJS, and global error handlers via ErrorHandler class for centralized logging and reporting.
27. What is the difference between Renderer2 and ElementRef?
ElementRef gives direct access to DOM elements, which can be unsafe. Renderer2 provides a safe, platform-independent way to manipulate the DOM.
28. What is the use of guards in Angular routing?
Guards control access to routes based on conditions. Types include CanActivate, CanDeactivate, Resolve, and CanLoad.
29. What is the difference between ngIf and hidden?
ngIf removes the element from the DOM when false, while [hidden] only hides it using CSS but keeps it in the DOM.
30. How do you improve SEO in Angular applications?
Use Angular Universal for server-side rendering, add meta tags with Meta service, and ensure proper routing and lazy loading to enhance crawlability and performance.
Search
Categories
Recent Posts
Top Git interview Questions for Experienced Developer
Speed-up tips and tricks for Windows 11
Top 15 Linux Commands used by Experienced Developer
Top SQL Interview Examples for Experienced Developer
Internal Working of Java HashMap
Recent Tags