Modules
the "founding father" of angular think the global-defined controller is ugly.
so they provide some APIs in Angular to declare those controllers.
angular.module('hello',[])
.controller("HelloCtrl",function($scope){
$scope.name="Mike";
});
Dependency Injection(DI)
the whole dependency management boils down to saying something along those line:"to function correctly I need a
dependency. I don't know from where it should be coming or how it should be createed. I just know I need one, so just
provide it."
Angular is only capable of wiring up objects it is aware of. the very first step for plugging into DI machinery is to
register an object with an Angujar mdule. We are not registering the object's instance directly, rather we are throwing
object-creation recipes into the Angular dependency injecion system. Angular then interprets those recipes to instantiate objects,
and then connects them accordingly.
In Angular, there is a dedicated $provide service that allows use to register different recipes for objects creation.
Registered recipes are then interpreted by the $injector service to provide fully-baked,ready-to-be-used object instances.
(with all the dependencies resolved and injected.)
Object that were created by the $injector service are referred to as services.
(Services created by $injector are singletions.)
Values
the easiest way to register a pre-instantiated one as follows.
var my=angular.mdule('my',[]);
my.value('myservice',new MyService());
in practice, this method is only used to work for very simple job,because no dependency in this example.
Service
my.service('myjob',MyJob);
var MyJob=function(myservice){
myservice.xxx();
}
the preceding code example shows another way to register a service using "service" method .
and you may find that this service has a dependency on the another service 'myservice' which is registered by the
"value" method.
(how Angular can notice that the parameter "myservice" in MyJob constructor is referring to a object of MyService is
what Angular DI does. )
Factories
another way to register recipes for objects creation is to use "factory" method. it is more flexible as compared to
the service method, since we can register any arbitrary object-creating function. An example is showing as follows.
my.factory('myjob',function(myservice){
return {
push:function(){},
put:function(){},
get:function(){},
.....
};
});
you may find that the "myjob" service contains API like 'push','put','get'.
Constant
sometime, we need constants in our program. and we can also register them as a service using
my.constant('MAX_LEN',10);
and you can use this constant like:
my.factory('myjob',function(myservice,MAX_LEN){
return {
push:function(){},
put:function(){},
get:function(){},
.....
};
});
Providers.
All the registration methods described so far are just special cases of the most generic, unltimate version of all of
them, provider.
my.provider('myjob',function(){
var config={minLen:10};
return {
setMinLen:function(minLen){
config.minLen=minLen||config.minLen;
},
$get:function(myservice,MAX_LEN){
return {
push:function(){},
put:function(){
if(10<config.minLen)
...
},
get:function(){},
.....
};
}
};
});
The provide is a function that must return an object containing the $get property. The mentioned $get property is a factory function,
that when invoked should return a service instance.
Modules lifecycle
A provider is a special kind of recipe, since it can be fruther configured before it produces any object instances.
To effectively support providers, Angular splits module's lifecycle into two phases, which are as follows:
1. The configuration phase: It is the phase where all the recipes are collected and configured
2. The run phase: It is the phase where we can execute any post-instantiaation logic.
The configuration phase:
my.config(function(myjobProvider){
myjobProvider.setMinLen(20);
});
the important thing to notice here is a dependency on myjobProvider object with a Provider suffix representing
the recipes that are ready to be executed.
The run phase:
my.run(function($rootScope){
$rootScope.appStarted=new Date();
});
the "founding father" of angular think the global-defined controller is ugly.
so they provide some APIs in Angular to declare those controllers.
angular.module('hello',[])
.controller("HelloCtrl",function($scope){
$scope.name="Mike";
});
Dependency Injection(DI)
the whole dependency management boils down to saying something along those line:"to function correctly I need a
dependency. I don't know from where it should be coming or how it should be createed. I just know I need one, so just
provide it."
Angular is only capable of wiring up objects it is aware of. the very first step for plugging into DI machinery is to
register an object with an Angujar mdule. We are not registering the object's instance directly, rather we are throwing
object-creation recipes into the Angular dependency injecion system. Angular then interprets those recipes to instantiate objects,
and then connects them accordingly.
In Angular, there is a dedicated $provide service that allows use to register different recipes for objects creation.
Registered recipes are then interpreted by the $injector service to provide fully-baked,ready-to-be-used object instances.
(with all the dependencies resolved and injected.)
Object that were created by the $injector service are referred to as services.
(Services created by $injector are singletions.)
Values
the easiest way to register a pre-instantiated one as follows.
var my=angular.mdule('my',[]);
my.value('myservice',new MyService());
in practice, this method is only used to work for very simple job,because no dependency in this example.
Service
my.service('myjob',MyJob);
var MyJob=function(myservice){
myservice.xxx();
}
the preceding code example shows another way to register a service using "service" method .
and you may find that this service has a dependency on the another service 'myservice' which is registered by the
"value" method.
(how Angular can notice that the parameter "myservice" in MyJob constructor is referring to a object of MyService is
what Angular DI does. )
Factories
another way to register recipes for objects creation is to use "factory" method. it is more flexible as compared to
the service method, since we can register any arbitrary object-creating function. An example is showing as follows.
my.factory('myjob',function(myservice){
return {
push:function(){},
put:function(){},
get:function(){},
.....
};
});
you may find that the "myjob" service contains API like 'push','put','get'.
Constant
sometime, we need constants in our program. and we can also register them as a service using
my.constant('MAX_LEN',10);
and you can use this constant like:
my.factory('myjob',function(myservice,MAX_LEN){
return {
push:function(){},
put:function(){},
get:function(){},
.....
};
});
Providers.
All the registration methods described so far are just special cases of the most generic, unltimate version of all of
them, provider.
my.provider('myjob',function(){
var config={minLen:10};
return {
setMinLen:function(minLen){
config.minLen=minLen||config.minLen;
},
$get:function(myservice,MAX_LEN){
return {
push:function(){},
put:function(){
if(10<config.minLen)
...
},
get:function(){},
.....
};
}
};
});
The provide is a function that must return an object containing the $get property. The mentioned $get property is a factory function,
that when invoked should return a service instance.
Modules lifecycle
A provider is a special kind of recipe, since it can be fruther configured before it produces any object instances.
To effectively support providers, Angular splits module's lifecycle into two phases, which are as follows:
1. The configuration phase: It is the phase where all the recipes are collected and configured
2. The run phase: It is the phase where we can execute any post-instantiaation logic.
The configuration phase:
my.config(function(myjobProvider){
myjobProvider.setMinLen(20);
});
the important thing to notice here is a dependency on myjobProvider object with a Provider suffix representing
the recipes that are ready to be executed.
The run phase:
my.run(function($rootScope){
$rootScope.appStarted=new Date();
});