AngularJS Interview Questions – Set 02

by

Describe the AngularJS boot process.

When a page is loaded into the browser, several things happen:

  • HTML document file gets loaded, and evaluated by the browser. AngularJS JavaScript file gets loaded, and the angular global object is created. Next, JavaScript file which is responsible for registering the controller functions is executed.
  • AngularJS scans through the HTML to find AngularJS apps and views. Once the view is found, it connects that particular view to the corresponding controller function.
  • AngularJS executes the controller functions. It further renders the views with data from the model populated by the controller, and the page gets ready.

Explain Currency filter in AngularJS. How can we use it?

The currency filter contains the “$” Dollar symbol as default. We can apply the following code as the html template format of Currency Filter.

{{ currency_expression | currency : symbol : fractionSize}}
We can use Currency Filter by using the following methods:

  • Default
    If we do not provide any currency symbol, then Dollar sign will be used by default as shown below:Default Currency{{amount | currency}}
  • User-Defined
    To use different types of currency symbols, we have to define our own symbol by applying the Hexa-Decimal code or Unicode of that Currency.
    E.g., To define Indian Currency Symbol, then we have to use Unicode-value or Hexa-Decimal value.
    Indian Currency{{amount | currency:”&# 8377″}}

Is AngularJS dependent on JQuery?

AngularJS is a JavaScript framework with key features like models, two-way binding, directives, routing, dependency injections, unit tests, etc. On the other hand, JQuery is a JavaScript library used for DOM manipulation with no two-way binding features

What are the services in AngularJS?

Services are objects that can be used to store and share data across the application. AngularJS offers many built-in services, and each of them is responsible for a specific task. They are always used with the prefix $ symbol.

Some of the important services used in any AngularJS application are as follows:

  • $http- It is used to make an Ajax call to get the server data.
  • $window- It provides a reference to a DOM object.
  • $Location- It provides a reference to the browser location.
  • $timeout- It provides a reference to the window.set timeout function.
  • $Log- It is used for logging.
  • $sanitize- It is used to avoid script injections and display raw HTML in the page.
  • $Rootscope- It is used for scope hierarchy manipulation.
  • $Route- It is used to display browser-based path in browser’s URL.
  • $Filter- It is used for providing filter access.
  • $resource- It is used to work with Restful API.
  • $document- It is used to access the window.Document object.
  • $exceptionHandler- It is used for handling exceptions.
  • $q- It provides a promise object.
  • $cookies- It is used for reading, writing, and deleting the browser’s cookies.
  • $parse- It is used to convert an AngularJS expression into a function.
  • $cacheFactory– It is used to evaluate the specified expression when the user changes the input.

How will you explain Manual Bootstrap Process in AngularJS?

Sometimes, we may need to manually initialize the Angular application to have more control over the initialization process. We can perform such task using angular.bootstrap() function within angular.element(document).ready() function. AngularJS uses this function when the DOM is ready for manipulation.

The angular.bootstrap() function uses two parameters, the document, and the module name injector.

What is the main purpose of find index in AngularJS, and what does it return if no value is found?

Find index is used to return the position of an element. It returns the value (-1) if the requested element is not found.

var index = $scope.items.findIndex(record => record.date ==’2018-12-12′);
In the given code, index of the object is returned where item.date=2018-12-12.

”How are AngularJS prefixes $ and $$ used?

$$ prefix in AngularJS is used as a private variable, as it is responsible for preventing accidental code collision with the user code.

Whereas, $ prefix is used to define angular core functionalities such as variable, parameter, property or method, etc.

Is it possible to have two ng-app directives for a single Angular application?

No, there can’t be more than one ng-app directive for a single AngularJS application.

The ng-app directive helps AngularJS application to make sure that it is the root element. In our HTML document, we can have only one ng-app directive. If there is more than one ng-app directive, then whichever appears first will be used.

What do you understand by Dependency Injection in AngularJS?

Dependency Injection (also called DI) is one of the best features of AngularJS. It is a software design pattern where objects are passed as dependencies rather than hard coding them within the component. It is useful for removing hard-coded dependencies and making dependencies configurable. To retrieve the required elements of the application that need to be configured when the module is loaded, the “config” operation uses Dependency Injection. It allows separating the concerns of different components in an application and provides a way to inject the dependent component into the client component. By using Dependency Injection, we can make components maintainable, reusable, and testable.

A simple case of dependency injection in AngularJS is shown below:

myApp.controller(‘myController’, function ($scope, $http, $location)
{
//logic
});
Here, a controller is declared with its dependencies.

AngularJS provides the following core components which can be injected into each other as dependencies:

  • Value
  • Factory
  • Service
  • Provider
  • Constant

What IDE’s are currently used for the development of AngularJS?

A term IDE stands for Integrated Development Environment. There are some IDE’s given below which are used for the development of AngularJS:

  • Eclipse
    It is one of the most popular IDE. It supports AngularJS plugins.
  • Visual Studio
    It is an IDE from Microsoft that provides a platform to develop web apps easily and instantly.
  • WebStorm
    It is one of the most powerful IDE for modern JavaScript development. It provides an easier way to add dependencies with angular CLI.
  • Aptana
    It is a customized version of Eclipse. It is free to use.
  • Sublime Text
    It is one of the most recommendable editors for HTML, CSS, and JavaScript. It is very much compatible with AngularJS code.