Angular 2 Interview Questions and Answers Part 3

11. What is dependency injection?

Answer:

Dependency injection is an important application design pattern and Angular has its own dependency injection framework. It provides the ability to add the functionalities to the components at runtime.

Angular 2 Dependency Injection consists of three things.

  • Injector: The injector object provides us a mechanism by which the desired dependency is instantiated.

  • Provider: A Provider is a medium by which we register our dependency that need to be injected.

  • Dependency: The dependency is an object of the class that we want to use.

12. What are the differences between Constructors and OnInit?

Answer:

Constructor:
Constructor is a default method of the class that is executed when the class is instantiated and ensures proper initialization of fields in the class and its subclasses. It is a feature of a class rather than an Angular feature.

OnInit:
ngOnInit is purely there to give a signal that Angular has finished initializing the component. ngOnInit is called just after the constructor call. The constructor should only be used to initialize class members. But when we have tasks related to Angular’s bindings we should use ngOnInit life cycle hook.

Example:

import {Component, OnInit} from '@angular/core';
export class App implements OnInit{
    constructor(){
    }
    ngOnInit(){
    }
}

13.  What is the use of codelyzer in angular 2 applications?

Answer:

All the application follow the some coding conventions and guidelines to maintain code in better way. Codelyzer is the open source tool that check if the coding conventions and guidelines are followed or not in our application.

Angular CLI supports the codelyzer. So codelyzer can be run via Angular CLI or npm directly.

14. What are differences between Components and Directives?

Answer:

Followings are the difference between components and Directives.

ComponentsDirectives
A @Component requires a view.@Directive does not require a view.
The components are used to split the application into smaller parts.The directives are used to design reusable components.
A component, rather than adding/modifying behavior, actually creates its own view.Directives add behavior to an existing DOM element or an existing component instance.
Only one component is used per DOM elements.More than one directive can be used per DOM elements.
@Component meta-data annotation is used to register the components.@Directive is used to register the directive.

15. What are the security threats should we be aware of an Angular 2 application?

Answer:

In a web application, security is the major issue. Angular 2 has the built-in protections against common web application vulnerabilities and cross-site scripting attack.

Following are the some basic guidelines to mitigate security risk.

  • Cross-site scripting (XSS)
  • Consider to using AOT compilation or offline compilation.
  • Try to avoid insecure direct object references.
  • Try to avoid external URLs if not trusted.
  • Avoid direct use of DOM API.
  • Cross-site request forgery (CSRF or XSRF)
  • Avoid using dynamic HTML content in our application.