[angularjs] AngularJS : When to use service instead of factory

Can use both the way you want : whether create object or just to access functions from both


You can create new object from service

app.service('carservice', function() {
    this.model = function(){
        this.name = Math.random(22222);
        this.price = 1000;
        this.colour = 'green';
        this.manufacturer = 'bmw';
    }
});

.controller('carcontroller', function ($scope,carservice) { 
    $scope = new carservice.model();
})

Note :

  • service by default returns object and not constructor function .
  • So that's why constructor function is set to this.model property.
  • Due to this service will return object,but but but inside that object will be constructor function which will be use to create new object;

You can create new object from factory

app.factory('carfactory', function() {
    var model = function(){
        this.name = Math.random(22222);
        this.price = 1000;
        this.colour = 'green';
        this.manufacturer = 'bmw';
    }
    return model;
});

.controller('carcontroller', function ($scope,carfactory) { 
    $scope = new carfactory();
})

Note :

  • factory by default returns constructor function and not object .
  • So that's why new object can be created with constructor function.

Create service for just accessing simple functions

app.service('carservice', function () {
   this.createCar = function () {
       console.log('createCar');
   };
   this.deleteCar = function () {
       console.log('deleteCar');
   };
});

.controller('MyService', function ($scope,carservice) { 
    carservice.createCar()
})

Create factory for just accessing simple functions

app.factory('carfactory', function () {
    var obj = {} 
        obj.createCar = function () {
            console.log('createCar');
        };
       obj.deleteCar = function () {
       console.log('deleteCar');
    };
});

.controller('MyService', function ($scope,carfactory) { 
    carfactory.createCar()
})

Conclusion :

  • you can use both the way you want whether to create new object or just to access simple functions
  • There won't be any performance hit , using one over the other
  • Both are singleton objects and only one instance is created per app.
  • Being only one instance every where their reference is passed.
  • In angular documentation factory is called service and also service is called service.

Examples related to angularjs

AngularJs directive not updating another directive's scope ERROR in Cannot find module 'node-sass' CORS: credentials mode is 'include' CORS error :Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response WebSocket connection failed: Error during WebSocket handshake: Unexpected response code: 400 Print Html template in Angular 2 (ng-print in Angular 2) $http.get(...).success is not a function Angular 1.6.0: "Possibly unhandled rejection" error Find object by its property in array of objects with AngularJS way Error: Cannot invoke an expression whose type lacks a call signature

Examples related to angularjs-service

Angularjs: Error: [ng:areq] Argument 'HomeController' is not a function, got undefined AngularJS Error: $injector:unpr Unknown Provider AngularJS : Factory and Service? how to call service method from ng-change of select in angularjs? AngularJS : When to use service instead of factory How to wait till the response comes from the $http request, in angularjs? How to access the services from RESTful API in my angularjs page? How do I configure different environments in Angular.js? AngularJS : The correct way of binding to a service properties AngularJS: Service vs provider vs factory

Examples related to angularjs-factory

AngularJS : Factory and Service? how to call service method from ng-change of select in angularjs? AngularJS : When to use service instead of factory AngularJS: Service vs provider vs factory