The other 3 are only barely documentedThis post describes each option and when to use it in more detail.

Registering a existing value as a service

You can register an existing value as service, using the following methods of the Module type:

“constant(name, value)“. intended for registering configuration data and should therefore only be used with primitives or object containing just data.

“value(name, value)“: registers a primitive, existing object instance or function.
The big difference between the “constant” and “value” methods is that:

“constant” should only be used for… constants.

services registered with “value” as well as the 3 other ways can even be proxied.

Consider the following example using both styles:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

varapp=angular.module('myApp',[]);

app.constant('magicNumber',42);

app.constant('bookTitle',"Hitchhiker's Guide");

functionUsingConstantServiceCtrl(magicNumber,bookTitle){

$scope.magicNumber=magicNumber;

$scope.bookTitle=bookTitle;

}

(function(){

varexistingServiceInstance={

getMagicNumber:function(){

return42;// Note that we are using an "hard-coded" magic number

}

};

app.value('magicNumberService',existingServiceInstance);

}());

functionUsingValueServiceCtrl(magicNumberService){

$scope.magicNumberFromService=magicNumberService.getMagicNumber();

}

Registering a factory function to create the singleton service instance

Instead of supplying an existing value, you could also register a factory function for the service.
However since services in AngularJS are “singletons” the factory function is invoked once.
A factory function can optionally take parameters which, just like controllers and directives, which will be injected by AngularJS.

Using “provider(name, providerType)” we can make our service configurable:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

app.provider('magicNumberService',{

// internal configuration data; configured through setter function

magicNumber:null,

// configuration method for setting the magic number

setMagicNumber:function(magicNumber){

this.magicNumber=magicNumber;

},

$get:function(magicNumber){

// use the magic number explicitly provided through "setMagicNumber" or

// otherwise default to the injected "magicNumber" constant

vartoBeReturnedMagicNumber=this.magicNumber||magicNumber;

// return the service instance

return{

getMagicNumber:function(){

returntoBeReturnedMagicNumber;

}

};

}

});

To allow configuration each service registered with ”provider(name, providerType)” automatically gets a “special” additional service with the “Provider” postfix.
This special “…Provider” service (i.e. “magicNumberServiceProvider”) can be used solely in combination with “Module#config(configFn)” to configure the service prior to its construction:

1

2

3

app.config('magicNumberServiceProvider',function(){

magicNumberServiceProvider.setMagicNumber(99);

});

When should you use which way?

There is no right or wrong when it comes the various way in which you can register a service.
Some might argue that “factory(name, providerFunction)” would be preferable since it’s extensively documented.
Others would prefer registering existing service instances using “value(name, value)“.

To ease choosing between the 4 different ways I will shortly recap all of them:

you typically would use “value” to register a service object or a function

whereas “constant” should only be used for configuration data

“factory(name, providerFunction)“: registers a factory function responsible for creating the “singleton” service instance.
Just like “value(name, value)” a factory function could return anything from primitive type, function or object instance.

“provider(name, providerType)“: the most advanced way to register a service.
Most often there is no need for your service to be configurable through a “…Provider” service, unless you are writing a reusable JavaScript library containing AngularJS services.

The “Registering Services” paragraph from the “Creating Services” section from the AngularJS “Developer Guide” describes how use the “factory(name, providerFunction)” method from the Module type to register services.

About Emil van Galen

My name is Emil van Galen, I work for JDriven.
I'm passionate about software development and continuously seeking for ways to improve code, learn new technologies, improving software design and keeping things fresh.

As it turned out my usage sample of “Module#provider” did actually contain an error (which I just corrected) which might have caused some confusion.

The “$get” (factory) function can be injected just like other AngularJS code.
Since at first I wasn’t completely sure of this myself I just created a Plunk based of the (corrected) “Module#provider” usage sample from the blog post that proofs that is works (check the console log to see that $q is injected):http://plnkr.co/edit/AnwHRE3khBUMPX4AuCLp?p=preview

Thank you for your suggestion… reading back my blog post I have to agree to some parts would me more descriptive with some real world examples.
Additionally I’m thinking of explaining “$provide” and the fact that Module#constant was also be wired into the Module#config function.