Services & Factories

Services and Factories are objects Angular injectables that we use to create objects. They are very similar to one another and are often used interchangeably.

• Service and factories both yield singleton objects.
• Once created this object will persist and you will get the same object back each time you request it.
• We can inject services and factories into controllers using DI.

A Service

We compose a service by giving Angular a newable function (one which writes to “this”).

angular.module("app").service("helloService", function () {
  this.sayHello = function () {
    alert("Hello");
  };
});

A Factory

A factory on the other hand composes an object and returns it:

angular.module("app").service("helloFactory", function () {
  return {
    sayHello: function () {
      alert("Hello");
    },
  };
});

Making use of factories and services

Once we declare them, services and factories become injectable. Let’s inject them into a controller:

angular
  .module("app")
  .controller("myController", function (helloService, helloFactory) {
    helloService.sayHello();
    helloFactory.sayHello();
  });

Services as API accessors

Services are often used as API accessors to take API code out of a controller and keep the controller focussed on $scope.

Here is a service that can talk to Github:

angular.module("app", []).service("github", function ($http) {
  var url = "https://api.github.com/events?callback=JSON_CALLBACK";
  this.getEvents = function () {
    return $http.jsonp(url);
  };
});

Further Reading

For more on the technical and conceptual differences between services and factories, read my Stack Overflow post here:

http://stackoverflow.com/a/27545899/687677