Post
Ask Question

Service and Factory in AngularJS

AngularJS Service: is used for sharing utility functions with the service reference in the controller. Service is singleton in nature so for once service only one instance is created in the browser and the same reference is used throughout the page.
  1. Service syntax:module.service( 'serviceName', function );  
AngularJS Factory: the purpose of Factory is also same as Service however in this case we create a new object and add functions as properties of this object and at the end we return this object.
  1. Factories:module.factory( 'factoryName', function );  
Example
  1. <div ng-app="Myapp">  
  2.     <div ng-controller="exampleCtrl">  
  3.         <input type="text" ng-model="num.firstnumber" />  
  4.         <input type="text" ng-model="num.secondnumber" />  
  5.         <input type="button" ng-click="Factoryclick()" value="Factoryclick" />  
  6.         <input type="button" ng-click="servclick()" value="Serviceclick" /> factory result {{facresult}} service result {{secresult}} </div>  
  7. </div>  
  1. var myapp = angular.module('Myapp', []);  
  2. myapp.controller('exampleCtrl', ['$scope', '$http', 'factories', 'services', function (scope, http, fac, ser)  
  3. {  
  4.     scope.Factoryclick = function ()  
  5.     {  
  6.         var firstnumber = parseInt(scope.num.firstnumber);  
  7.         var secondnumber = parseInt(scope.num.secondnumber);  
  8.         scope.facresult = fac.sumofnums(firstnumber, secondnumber);  
  9.     }  
  10.     scope.servclick = function ()  
  11.     {  
  12.         var firstnumber = parseInt(scope.num.firstnumber);  
  13.         var secondnumber = parseInt(scope.num.secondnumber);  
  14.         debugger;  
  15.         scope.secresult = ser.sersumofnums(firstnumber, secondnumber);  
  16.     }  
  17. }]);  
  18. myapp.factory('factories', function ($http)  
  19. {  
  20.     return {  
  21.         sumofnums: function (a, b)  
  22.         {  
  23.             return a + b;  
  24.         }  
  25.     }  
  26. });  
  27. myapp.service('services', function ($http)  
  28. {  
  29.     debugger;  
  30.     this.sersumofnums = function (a, b)  
  31.     {  
  32.         return a + b;  
  33.     };  
  34. });