Angular 2 Interview Questions and Answers Part 2

6. Explain the life cycle hooks of the Angular 2 application.

Answer:

The lifecycle events of Angular 2 component/directive are managed by @angular/core. It creates the component and renders it, processes changes when it’s data-bound properties change, and then destroys it before removing its template from the DOM. Angular has a set of lifecycle events. These events can be tapped and perform operations when required. The constructor executes prior to all lifecycle events. The constructor is meant for light weight activities and usually used for dependency injection.

Following events are the applicable for both component and directive.

• ngOnChanges: It is called when the value of a data bound property changes.


• ngOnInit: This is called after the first ngOnChange events.


• ngDoCheck: This is called after every change detection run.


• ngAfterContentInit: It is called after every component content initialized.


• ngAfterContentChecked: It is called after every check of component content.


• ngAfterViewInit: This is called after angular initializes the component view’s and child view.
  

• ngAfterViewChecked: This is called after every check of a component's view(s).


• ngOnDestroy: It is called just before the component is destroyed.

7. What is Lazy loading?

Answer:

In lazy loading our application does not load everything at once. It loads only those things what the user expects to see when the app first loads. It helps us decrease the startup time.

Lazy loading enables us to load only the module user is interacting and keep the rest to be loaded at run time on demand.

8. How to handle error in Angular 2 application?

Answer:

In Angular 2 applications, error handling is done by including the RxJS catch library and then using the catch function.

In the error handler function, we send the error to the console. We also throw the error back to the main program so that the execution can continue.

The catch function contains a link to the Error Handler function.

9. What are the event emitters in Angular 2 and how it works?

Answer:

EventEmitter is an angular 2 abstraction and its only purpose is to emit events in components.

Any change occurred in the component always gets propagated from the current component to all its children in hierarchy. If the change from one component needs to be reflected to any of its parent component in hierarchy, we can emit the event by using Event Emitter API.

In short, EventEmitter is used by components and directives to emit custom events.

The EventEmitter class is defined in '@angular/core' module.

@output() somethingChanged = new EventEmitter();

We use somethingChanged.emit(value) method to emit the event.

10. What is Pipes in Angular 2?

Answer:

Filters in AngularJS 1.x are known as Pipes in Angular 2.

Pipes allow us to change the data inside the template. Normally, a pipe takes the data and transforms this input to the desired output. There are many built-in pipes in Angular 2.

There are multiple built-in pipes in Angular 2.

• DatePipe
• UpperCasePipe
• LowerCasePipe
• CurrencyPipe
• PercentPipe