Factory vs Service

angularjs factory vs service do the same thing, just a different way of instantiation

by Marventus

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<div ng-controller="HelloCtrl">
    <p>{{fromService}}</p>
    <p>{{fromFactory}}</p>
</div>
<br />
<div ng-controller="GoodbyeCtrl">
    <p>{{fromService}}</p>
    <p>{{fromFactory}}</p>
</div>

JavaScript

//angular.js example for factory vs service
var myApp = angular.module('myApp', []);
    
myApp.factory('testFactory', function(){
    return {
        sayHello: function(text){
            return "Factory says \"Hello " + text + "\"";
        },
        sayGoodbye: function(text){
            return "Factory says \"Goodbye " + text + "\"";
        }  
    };               
});

myApp.service('testService', function(){
    this.sayHello = function(text){
        return "Service says \"Hello " + text + "\"";
    };        
    this.sayGoodbye = function(text){
        return "Service says \"Goodbye " + text + "\"";
    };   
});

myApp.controller('HelloCtrl', ["$scope", "testService", "testFactory", function($scope, testService, testFactory)
{
    console.log("Entré Hello!");
    $scope.fromService = testService.sayHello("World");
    $scope.fromFactory = testFactory.sayHello("World");
}]);

myApp.controller('GoodbyeCtrl', ["$scope", "testService", "testFactory", function($scope, testService, testFactory)
{
    console.log("Entré Goodbye!");
    $scope.fromService = testService.sayGoodbye("World");
    $scope.fromFactory = testFactory.sayGoodbye("World");
}]);