Difference between Factory, Service and Providers
$provide.provider
, $provide.factory
and $provide.service
are more or less the same thing in the sense that all of them are blueprints / instructions for creating object instances (those instances are then ready to be injected into collaborators).
$provide.provider
is the most spohisticated method of registering blueprints, it allows you to have a complex creation function and configuration options.
$provide.factory
is a simplified version of $provide.provider when you don't need to support configuration options but still want to have a more sophisticated creation logic.
$provide.service
is for cases where the whole creation logic boils down to invoking a constructor function.
So, depending on the complexity of your construction logic you would choose one of $provide.provider
, $provide.factory
and $provide.service
but in the end what you are going to get is a new instance.
Example
var myApp = angular.module('myApp', []);
//service style, probably the simplest one
myApp.service('helloWorldFromService', function() {
this.sayHello = function() {
return "Hello, World!"
};
});
//factory style, more involved but more sophisticated
myApp.factory('helloWorldFromFactory', function() {
return {
sayHello: function() {
return "Hello, World!"
}
};
});
//provider style, full blown, configurable version
myApp.provider('helloWorld', function() {
this.name = 'Default';
this.$get = function() {
var name = this.name;
return {
sayHello: function() {
return "Hello, " + name + "!"
}
}
};
this.setName = function(name) {
this.name = name;
};
});
//hey, we can configure a provider!
myApp.config(function(helloWorldProvider){
helloWorldProvider.setName('World');
});
function MyCtrl($scope, helloWorld, helloWorldFromFactory, helloWorldFromService) {
$scope.hellos = [
helloWorld.sayHello(),
helloWorldFromFactory.sayHello(),
helloWorldFromService.sayHello()
];
}