11. What is SPA in Angular?
Answer:
SPA stands for Single Page Application.
These are web apps that load a single HTML page and dynamically update that page as the user interacts with the app. To implement SPA with Angular, we can use Angular routes.
While using SPA, you don't need to refresh the whole page.
SPA has ability to work offline because all the pages are already loaded.
12. What is Dependency Injection in AngularJS?
Answer:
Dependency injection is a software design pattern in which objects are passed as dependencies.
It helps to remove hard coded dependencies and makes dependencies configurable.
It helps in making components reusable, maintainable and testable.
AngularJS provides a supreme Dependency Injection mechanism. It provides following core components which can be injected into each other as dependencies.
1. value: It is simple javascript object, used to pass values to controller during config phase.
2. factory: It is a function which is used to return value. It creates value on demand whenever a service or controller requires.
3. service: It is a singleton javascript object containing a set of functions to perform certain tasks.
4. provider: It is used by AngularJS internally to create services, factory etc. during config phase(phase during which AngularJS bootstraps itself).
5. constant: It is used to pass values at config phase considering the fact that value can not be used to be passed during config phase.
13. What is controller in AngularJS?
Answer:
Controller is a set of JavaScript functions which contains business logic for the view. The controllers control the data of AngularJS applications.
The ng-controller directive defines the application controller.
Example:
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
First Name: <input type="text" ng-model="firstName"><br>
Middle Name: <input type="text" ng-model="middleName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{firstName + " " + middleName+ " " + lastName}}
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope)
{
$scope.firstName = "Joy";
$scope.middleName = "Alex"
$scope.lastName = "Ray";
});
</script>
</body>
</html>
14. What is Filter in AngularJS?
Answer:
Filter is a module provided by AngularJS which is used to modify the data and can be clubbed in expression or directives using a pipe character.
It can be used in view templates, controllers or services and you can easily create your own filter.
Filters can be added in AngularJS to format data.
AngularJS provides following filters to transform data:
1. currency formats a number to a currency format.
2. date formats a date to a specified format.
3. filter selects a subset of items from an array.
4. json formats an object to a JSON string.
5. limitTo limits an array/string, into a specified number of elements/characters.
6. lowercase formats a string to lower case.
7. number formats a number to a string.
8. orderBy orders an array by an expression.
9. uppercase formats a string to upper case.
Filters can be added to expressions by using the pipe character |, followed by a filter.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Uppercase Filter Format</title>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<h2>Uppercase Filter Format</h2>
<div ng-app="myApp" ng-controller="personCtrl">
<p>The name is {{ firstName | uppercase }}</p>
</div>
<script>
angular.module('myApp', []).controller('personCtrl', function($scope) {
$scope.firstName = "Alex",
$scope.lastName = "Rey"
});
</script>
</body>
</html>
15. Why should we use AngularJS?
Answer:
AngularJS helps to organize the web applications properly, makes responsible and well organized web applications that are more expansive and readable.
It supports services and dependency injection which we can easily inject in our controller and provides some utility code as per our requirement.
AngularJS allows you extend HTML’s syntax to express your application’s components in a clear manner.
It is a structural framework for dynamic web applications.
AngularJS uses HTML, which is a declarative, intuitive and less convoluted language than defining an interface in JavaScript.
