The largest Interview Solution Library on the web


java tutorials/
« Previous | 1 | 2 | 3 | Next »
Angular JS Services

AngularJS Services Application

Enter a number:

Result: {{result}}

<!-- AngularJS supports the concepts of "Separation of Concerns" using services architecture.
Services are javascript functions and are responsible to do a specific tasks only.
This makes them an individual entity which is maintainable and testable. Controllers, filters can call them as on requirement basis.
Services are normally injected using dependency injection mechanism of AngularJS.
two ways to create services:
Using factory method
Using factory method, we first define a factory and then assign method to it.
var mainApp = angular.module("mainApp", []);
mainApp.factory('MathService', function() {
var factory = {};
factory.multiply = function(a, b) {
return a * b
}
return factory;
});
Using service method
Using service method, we define a service and then assign method to it. We've also injected an already available service to it.
mainApp.service('CalcService', function(MathService){
this.square = function(a) {
return MathService.multiply(a,a);
}
});
-->
<html>
<head>
<title>Angular JS Services
</head>
<body>
<h2>AngularJS Services Application
<div ng-app = "mainApp" ng-controller = "CalcController">
<p>Enter a number: <input type = "number" ng-model = "number" /></p>
<button ng-click = "square()">X<sup>2</sup></button>
<p>Result: {{result}}</p>
</div>
<script>
var mainApp = angular.module("mainApp", []);
mainApp.factory('MathService', function() {
var factory = {};
factory.multiply = function(a, b) {
return a * b
}
return factory;
});
mainApp.service('CalcService', function(MathService){
this.square = function(a) {
return MathService.multiply(a,a);
}
});
mainApp.controller('CalcController', function($scope, CalcService) {
$scope.square = function() {
$scope.result = CalcService.square($scope.number);
}
});
</script>
</body>
</html>
« Previous | 1 | 2 | 3 | Next »
copyright © 2014 - all rights riserved by javatechnologycenter.com