Friday, May 24, 2013

Angular service or factory?

tl;dr is at the end

In various AngularJS tutorials and documentation, the authors choose to use service or factory but don't explain why you would use one or the other. Few mention that value and constant are also options.

Let's see why you would use one over the other. We should also understand how providers work:

// This will fail with "Error: Unknown provider: samTheValue from joe"varinjector=angular.injector(['joe','ng']);

Read Module Loading & Dependencies in the Modules doc for more information on usage.

In summary

If you want your function to be called like a normal function, use factory. If you want your function to be instantiated with the new operator, use service. If you don't know the difference, use factory.

This is the (great) documentation for each function in the AngularJS source:

factory

A short hand for configuring services if only `$get` method is required.

service

A short hand for registering service of given class.

value

A short hand for configuring services if the `$get` method is a constant.

constant

A constant value, but unlike {@link AUTO.$provide#value value} it can be injected into configuration function (other modules) and it is not interceptable by {@link AUTO.$provide#decorator decorator}.

Nice little article, I would differ however, and say, if you don't know the difference between calling 'like a regular function' and using the new operator: You should figure out the difference first, and then not just blindly pick factory.

Sorry it's taken me so long. In the way I generally use `factory`, there wouldn't be a significant difference if I used `service` instead. But if I wanted to use a javascript "class" (by adding methods to a prototype object), then I would need to use `service.`

Here's more discussion about what "new" does: http://stackoverflow.com/questions/1646698/what-is-the-new-keyword-in-javascript

A grate documentation and awesome article. AngularJS works great with other technologies. Add as much or as little of AngularJS to an existing page as you like. Many other frameworks require full commitment. This page has multiple AngularJS applications embedded in it, read more.

Your post says ..."The above code will instantiate Gandalf, but remember that everything that uses the service will get the same instance! (which is a good thing)."And then, at the end it says, "If you want your function to be instantiated with the new operator, use service"

So, by using a service, do I get a new instance or the same old instance ?Because, if the method is instantiated each time, then it must give a diff instance right ?

It is non clear to me what the method $get must be. Let me know if i get it right: the $get method is a (annotated) function whose return value (object, function or primitive type) is what we get when we use the service. In the case of service there is no $get method, instead we pass a constructor which constructs the object we get when we use the service (in this case we can only use an object, not a function or a primitive value)