Dependency Injection in Angular JS

Dependency Injection di

In Angularjs, there are Angular.module (), Angular.injector (), $injector, $provide in relation to Di.

DI Container 3 Features: Registration of services, declaration of dependencies, acquisition of objects.

Dependency Injection	di in spring	Angularjs in di
Service registration	via XML config file <bean> tags or annotations @ Repository, @Service, @Controller, @Component implemented	module and $provide equivalent to the registration of the service ;
Dependency declaration	can be XML file, you can also use annotations such as @resource to declare
Object get	Application Context.getbean () implements	Injector used to get objects (angular automatically completes dependency injection)

Three ways to angular dependency declarations

Angular provides 3 ways to get dependencies: inference, annotation, and inline.

where annotation and inline are not required for function parameter names, it is recommended that the inference method requires the parameter name and service name to be the same, and if the JS code is compressed or confused, then the functionality will be problematic and is not recommended.

//Create a MyModule module, register a servicevarMyModule = Angular.module (' MyModule '), []); Mymodule.service (' MyService ',function() {      This. my = 0;});//Get InjectorvarInjector = Angular.injector (["MyModule"]);//The first kind of inferenceInjector.invoke (function(myservice) {alert (myservice.my);});//The second kind of annotationfunctionExplicit (ServiceA) {alert (servicea.my);}; Explicit. $inject= [' MyService '];injector.invoke (Explicit);//The third type of inlineInjector.invoke ([' MyService ',function(ServiceA) {alert (servicea.my);}]);

How to understand module?

angular.module()the is a global place for creating, registering and retrieving Angular modules. When passed and more arguments, a new module is created. If passed only one argument, a existing module (the name passed as the first argument to module ) is retrieved.

The function can either create a new module or get an existing module, which is created or fetched, and is distinguished by the number of parameters.

// passing more than one parameter, representing a new module; an empty array means that the module does not depend on other modules var createmodule = Angular.module ("MyModule", []); // only one parameter (module name), representing the Get module // If the module does not exist, the angular frame throws an exception var getmodule = Angular.module ("MyModule"); // true, both are the same module alert (createmodule = = GetModule);

So what exactly is a module?

The official developer Guide has only one sentence: Can think of a module as a container for the different parts of your app–controllers, servi Ces, filters, directives, etc.

This means that the module is a collection of functions, such as controllers, services, filters, directives and other sub-elements of the whole.

the relationship between $provide and modules

The $provide service has a number of methods for registering and the $injector. Many of these functions is also exposed on angular.Module .

Mentioned before: module and provide are used to register services to injector. Viewing the official API, you can see that $provide provides provide (), constant (), value (), Factory (), service () to create services of various natures; angular. The 5 service registration methods are also available in the module. In fact, the 2 function is exactly the same, is used to register the DI container service into the injector.

The official API under Auto has $provide and $injector, implicit module which gets automatically added to each $ Injector. Literally means that every injector has these 2 hidden services.

Angular.injector ()

Use Angular.injector () or get to the injector, but not the module binding. This does not make sense, equivalent to creating an empty di container in which there is no service for what others are doing. The correct approach is to specify the modules that need to be loaded when creating the injector.

//Create a MyModule module, register a servicevarMyModule = Angular.module (' MyModule '), []); Mymodule.service (' MyService ',function() {             This. my = 0;});//Create a hermodule module, register a servicevarHermodule = Angular.module (' Hermodule '), []); Hermodule.service (' Herservice ',function() {             This. her = 1;});//services loaded in 2 modulesvarInjector = Angular.injector (["MyModule", "Hermodule"]); alert (Injector.get ("MyService"). my); Alert (Injector.get ("Herservice"). Her);

It is particularly important to note that Angular.injector () can be called multiple times, returning the newly created injector object each time .

var injector1 = Angular.injector (["MyModule", "Hermodule"]); var injector2 = Angular.injector (["MyModule", "hermodule"= = Injector2);   false

Reference: http://www.mamicode.com/info-detail-247448.html

Dependency Injection in Angular JS