AngularJS interview questions and answers for experienced

There is some basic knowledge expected about AngularJS framework in a interview.These questions covers the basic concepts of AngularJS and will help you understand the framework.

Question 1.What is AngularJS
Question 2.Which browsers Support AngularJS applications
Question 3.Is AngularJS Server side framework
Question 4.How to include AngularJS in our application?
Question 5.How do you Show and Hide Elements in AngularJS application
Question 6.How do you repeatedly display an HTML element
Question 7.What is Data-binding in AngularJS
Question 8.What is app directive
Question 9.What is Controller
Question 10.What is $Scope
Question 11.What are Directives
Question 12.What are Filters
Question 13.What is AngularJS Expression
Question 14.What is $rootScope
Question 15.What is Bootstrapping
Question 16.What is routing
Question 17.What is Service in AngularJS
Question 18.What is $location Service in AngularJS
Question 19.What is $http service in AngularJS
Question 19.How AngularJS application is compiled?

Question 1. What is AngularJS?

Some of the important points about AngularJS:

AngularJS is a open source JavaScript framework developed by Google.
It is useful in developing dynamic web application.HTML is used for developing static web pages.AngularJS enhances HTML for developing Dynamic web applications.
It is a front end framework for developing web applications.AngularJS applications runs on the browser.
AngularJS is useful for Developing single page applications.
It is open source ,which means anybody can use AngularJS framework for developing applications.To develop AngularJS application you just need to reference the AngularJS JavaScript library.
You can reference JavaScript library by using the a <script> tag in the HTML page.
It is used to develop applications based on the Model,View,Controller pattern.
It extends HTML pages by using directives. AngularJS includes built in directives.We can also create custom directives.
Some inbuilt AngularJS directives are ng-app,ng-model ,ng-controller and ng-init.

Question 2. Which browsers Support AngularJS applications?

Almost all the modern browsers support AngularJS framework. Some of the modern browsers on which AngularJS applications can execute are:

Chrome
Firefox
Safari
Internet Explorer

So AngularJS is supported in all of the browsers being used today.

Question 3.Is AngularJS Server side framework?

No.Angular is totally client side framework and AngularJS applications executes only in the browser.Though they can communicate with the server using WebAPI and Web Service calls.

Question 4.How to include AngularJS in our application?

AngularJS is a JavaScript framework.It needs to be referenced using script tag just like any other JavaScript framework.There are two ways we can referenced AngularJS in a HTML page.

through AngularJS CDN:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>

2. by downloading AngularJS library locally from the below URL.If you download the AngularJS library locally then your AngularJS applications will execute offline without any network connection.AngularJS source can be downloaded from the following path:

https://code.angularjs.org/

Size is less than 50KB when you download the library.

Question 5.How do you Show and Hide Elements in AngularJS application?

There are two directives to show and hide html elements using AngularJS

ng-show To show elements based on a boolean expression
ng-hide To hide elements based on a boolean expression

The following will display the True when IsTrue variable is true

<div ng-show="IsTrue">True</div>

Question 6.How do you repeatedly display an HTML element?

ng-repeat directive is used to repeatedly showing html elements.For example to display HTML template for a collection of employees in a Model:

<div ng-repeat="employee in empCollection">
{{employee .name}}
</div>

The above code will display employee name for each employee in employee collection.We need to set the empCollection in our controller.

Question 7.What is Data-binding in AngularJS?

Data binding binds or connects the model with the view and automatically synchronizes the data at all times.So when the view or model changes ,the other is automatically updated.For data binding AngularJS has following directives for data binding

ng-bind for binding the inner text property of HTML element
ng-bind-template html text of the element is replaced with expression specified in ng-bind-template attribute
ng-non-bindable for defining HTML region which will not be bound
ng-model for two data binding

Question 8.What is app directive?

The ng-app directive defines the AngularJS applications scope.Following will limit the scope of AngularJS application to the div.This means that AngularJS application will start when the HTML element div is loaded on the page.

<div ng-app = "employeeApp">

</div>

Question 9.What is Controller?

Controller is used for setting the state and behavior in the scope.Controller is attached to a HTML element using the ng-controller attribute:

<div ng-app = "employeeApp" ng-controller = "employeeController">
{{name}}
</div>

The above markup will attach employeeController to the div.
When the HTML element is instantiated the controller function is executed.A $scope is passed to the controllers constructor function.
We write a controller function as:

mainApp.controller('studentController', function($scope) {
$scope.name = "Ashish";
});

Question 10.What is $Scope?

Scope is a object which works as a bridge between controller and view:

We set model values on the scope object in the controller:

app.controller("myController", function($scope) {
$scope.message = "Hello AngularJS";
});

The above model value for message will be available in the view:
{{message}}

Question 11.What are Directives?

The job of a directive is to manipulate HTML DOM.The logic to manipulate the DOM should not exist any where else but only in the directive.

Directives are applied as attributes to HTML elements.They are like normal HTML attributes.Directives extend HTML by providing behavior which not available in HTML.AngularJS directives starts with ng- prefix.

Some of the commonly used directives are:

ng-app − Defines the scope of AngularJS Application.We apply this to the root element which defines the scope of our application.
ng-controller − Starts AngularJS application.
ng-init − Initializes application data.
ng-model − Binds the model to HTML element in AngularJS view.
ng-bind − Binds the model to HTML element in AngularJS view.
ng-repeat − Repeats html elements for each item in a collection.

Question 12. What are Filters?

Filters are used for transforming data .We apply filter to an expression to format the values for displaying.Filter is applied to an expression as:

Some of the common filters provided by AngularJS are:

date
currency
limitTo
lowercase
uppercase

Following will display the name in lower case

{{ name | lowercase }}

Question 13.What is AngularJS Expression?

Expressions are Javascript code snippets.AngularJS Expressions are written within curly braces.We can include variables and operators in AngularJS Expressions

{{ a + b }}
rootScope

Question 14.What is $rootScope?

In any AngularJS application $scope object is by default available to views and controllers.It acts as a view model since both view and controler has access to it.

In AngularJS $rootScope is the parent scope for all the other scopes.scope is like a view model.We set scope in controller and read its value in view.You can set the value of $rootScope in one controller and read it in another controller.

Question 15.What is Bootstrapping?

Bootstrapping means initializing or starting an Angular application. Angular application is automatically bootstrapped when we apply the ng-app directive to an html element:

<div id="div1" ng-app="myApp">

</div>

The above markup starts an Angular application.The scope of the application is “div1”.So we can use Angular features,such as directives, only within the div.

Question 16.What is routing?

Routing is used to load the different views in the browser.Since AngularJS framework is a JavaScript framework so application views are updated dynamically in the browser.Routing helps to define the mapping between the URL patterns and the controller and view.Routes in AngularJS are defined using the $routeProvider service.

Question 17.What is service in AngularJS ?

Service is a function which provides functionality to other angular components.We can define a service using the
service() method of the module as:

app.service('ServiceName', function () {
this.SampleFunction = function () {
};
});

Question 18.What is $location service?

The $location service is used to return information about the location of the web page.

Question 19.What is $http service?

The $http service is used to send a request to the server and get the response.It sends the request using the browser’s XMLHttpRequest object

Question 20.How AngularJS application is compiled?

AngularJS uses $compile service for compiling AngularJS applications.Compilation happens on the client since AngularJS is a client side framework.Compilation happens in two steps:

Compile All the directives are collected after traversing the DOM.

Link Live view is produced.

ashish

Follow on: