AngularJS $Provide Service

3. Service
Factory
Provider

4. var mi= angular.module('myModule', []);
mi.factory('serviceId', function () {
var shinyNewServiceInstance;
//factory function body that constructs shinyNewServiceInstance
return shinyNewServiceInstance;
});
angular.module('myModule', [], function ($provide) {
$provide.factory('serviceId', function () {
var shinyNewServiceInstance;
//factory function body that constructs shinyNewServiceInstance
return shinyNewServiceInstance;
});
});

6. angular.module('myApp', [])
.provider('myPro', function() {
console.log('myApp => Create provider => retrun object with $get');
return {
isTrue: false,
$get: function b($log) {
var self = this;
console.log('myApp => my Provider $get => retrun func');
return function c(msg) {
$log.debug(msg + " isTrue: " + self.isTrue);
};
}
};
});
Step 1: Invoke the function
before the config stage. No
args.
app.config(function (myProProvider) {
myProProvider.isTrue = true;
console.log('myApp --> config');
});
Step 2: This object will be
available in config stage as
injectable service. The name
is "myProProvider".
Step 3: $get func is
a factory func for the
service, invoke only if
needed and only
once. Available after
the config stage.
Step 4: The injectable service.

7. Angular register your provider ( {..} | f )
Module Config( {..} )
Execute the $get function
Decorator stage
Module Run( {..} | f )

9. function provider(name, provider_) {
if (isFunction(provider_) || isArray(provider_)) {
provider_ = providerInjector.instantiate(provider_);
}
if (!provider_.$get) {
throw Error(...'must define $get factory method.');
}
return providerCache[name + providerSuffix] = provider_;
}
// Register an object provider
myApp.provider('awesome', {
$get: function () {
return 'awesome data';
}
});
Step 1: Invoke the function
before the config stage. No
args.
Step 2: This object will be
available in config stage as
injectable service. The name
is "[name + providerSuffix]".

10. angular.module('myApp', [])
.factory('myfac', function ($http) {
console.log('myApp -> Create factory');
return function (msg) {
console.log(msg);
};
});
Step 2: The injectable service.
Step 1: factory func for the service,
invoke only if needed and only once.
Available after the config stage.
app.run(function ( myfac ){
console.log('myApp --> run');
myfac("test");
});

11. function factory(name, factoryFn) {
return provider(name, { $get: factoryFn });
}
// Sample Code
angular.module('myApp', [])
.factory('myfac', function ($http) {
console.log('myApp -> Create factory');
return function (msg) {
console.log(msg);
};
});

12. function factory(name, factoryFn) {
return provider(name, { $get: factoryFn });
}
// Sample Code
angular.module('myApp', [])
.provider('myfac', { $get : function ($http) {
console.log('myApp -> Create factory');
return function (msg) {
console.log(msg);
};
}
}
);

13. function MyService($http) {
console.log('Create my Service => retrun object this.');
this.msg = 'NAN';
}
MyService.prototype.log = function (val) {
console.log(this.msg + val );
};
angular.module('myApp', []).service( 'myService', MyService );
 Angular use the new operator to create instance.
 The return object (this) is the singleton service.
 Everything that uses the service will get the same
instance!

14. function service(name, constructor) {
return factory(name, ['$injector', function ($injector) {
// instantiated with the new operator
return $injector.instantiate(constructor);
}]);
}
 Angular use the new operator to create instance.
 The return object (this) is the singleton service.
 Everything that uses the service will get the same
instance!

15. function service(name, constructor) {
return provider(name, {
$get: ['$injector', function ($injector) {
// instantiated with the new operator
return $injector.instantiate(constructor);
}]
});
}
 Angular use the new operator to create instance.
 The return object (this) is the singleton service.
 Everything that uses the service will get the same
instance!

16. function value(name, value) {
return factory(name, valueFn(value));
}
// Sample Code
myApp.value('awesome', 'awesome data');
function valueFn(value) {return function() {return value;};}

17. // Sample Code
angular.module('myApp', [])
.constant('PI', 3.14)
.config(function (PI) { ... });
// AngularJS Constant Code
function constant(name, value) {
providerCache[name] = value;
instanceCache[name] = value;
}

19. Angular register your provider ( {..} | f )
Module Config( {..} )
Execute the $get function
Decorator stage
Module Run( {..} | f )

20. // Sample Code
$provide.decorator('$log', function ($delegate, $http) {
$delegate.warn = $delegate.error;
return $delegate;
});
$log
You can ask
any service

21. function decorator(serviceName, decorFn) {
var origProvider = providerInjector.get(serviceName + providerSuffix),
orig$get = origProvider.$get;
origProvider.$get = function() {
var origInstance = instanceInjector.invoke(orig$get, origProvider);
return instanceInjector.invoke(
decorFn, null, { $delegate: origInstance }
);
};
}
Override the $get function.
Invoke the decoFn with
original service instance as
argument.

23. eyalvardi.wordpress.com