Index Interview Questions and Answers

Lazy loading is a technique to load modules on demand instead of loading everything at once.

• Lazy loading improves the initial load time of the application.

• It splits the application into smaller chunks that can be loaded when needed.

• In Angular, lazy loading is achieved by configuring the routes with loadChildren property.

• Syntax for routing path with lazy loading: { path: 'lazy', loadChildren: () => import('./lazy/lazy.module').then(m => m.LazyModule) }

Using services or shared state management libraries like RxJS or NgRx

• Use services to store and share data between components

• Use shared state management libraries like RxJS or NgRx for complex data sharing

• Use @Input and @Output decorators for parent-child component communication

Angular Hooks are functions that allow you to execute code at specific stages of a component's life cycle.

• ngOnInit() - called after the component is initialized

• ngOnChanges() - called when the component's input properties change

• ngDoCheck() - called during every change detection cycle

• ngAfterContentInit() - called after content is projected into the component

• ngAfterContentChecked() - called after every check of projected content

• ngAfterViewInit() - called after the component's vi...read more

Promises are used for a single asynchronous operation, while observables are used for multiple asynchronous operations over time.

• Promises are eager, meaning they start immediately upon creation. Observables are lazy, meaning they only start when subscribed to.

• Promises can only handle a single value, while observables can handle multiple values over time.

• Observables are cancellable, while promises are not.

• Observables provide operators like map, filter, and reduce for transform...read more

Life cycle hooks are functions that allow you to tap into the lifecycle of Angular components.

• Life cycle hooks are predefined methods that get called at specific points in the component's life cycle.

• They allow you to perform actions like initialization, change detection, and destruction.

• Examples of life cycle hooks include ngOnInit, ngOnChanges, and ngOnDestroy.

Forms in Angular are used to handle user input and validation.

• Template-driven forms: Uses directives like ngModel to build forms in the template.

• Reactive forms: Uses form control objects to build forms programmatically in the component.

• Form validation: Angular provides built-in validators like required, minLength, and custom validators.

• Form submission: Forms can be submitted using ngSubmit event or formControl methods.

• Handling form data: Data can be accessed and manipulated u...read more

Data binding is the automatic synchronization of data between the model and view components in an Angular application.

• Data binding allows for the seamless communication between the component class and the template.

• There are four types of data binding in Angular: Interpolation, Property binding, Event binding, and Two-way binding.

• Example: {{ title }} in the template binds the value of 'title' from the component class to the view.