Home > Developer > Web Develop
ANGULARJS provides some functionality for encapsulation, but when you try to access these features through the global object angular, you find that it is very different from the libraries you have encountered before.
For example, Angularjs exposes a global object: angular, which also encapsulates an Ajax call, provides a $http object, but when accessing angular. $http, you can't find it.
Dependency Injection/di
In fact, ANGULARJS organizes all of the functional components in a dependency injection mode in which all components must be accessed through the container, which results in the ANGULARJS that you must pass an intermediary to get the instance object of a component
1 var injector = Angular.injector ([' ng ']); 2 injector.invoke (function($http) {3 //dosth. With $http 4 });Example: Printing $http code
1 angular.element (document). Ready (function() {2 angular.injector (["ng"]) . Invoke (function($http) {3 // $http object is converted to a string to display 4 var e = Document.queryselector ("#logger"); 5 angular.element (E). Text ($http. toString ()); 6 }); 7 });<HTML><Head> <Scriptsrc= "Angular.js"></Script></Head><Body> <!--The contents of $http are shown here - <DivID= "Logger"></Div></Body></HTML>
Injector/injector
Injector is the key of ANGULARJS framework implementation and application development, which is the implementation of a DI/IOC container.
Angularjs the functions into different types of components, each of which has a collectively known as the provider/provider.
ANGULARJS components cannot be called directly to each other, and one component must pass the injector to invoke another component. The benefit is that the components are decoupled from one another, and the entire life cycle of the object is managed by the injector.
Registering Service ComponentsFrom Injector's point of view, a component is a function provider and is therefore called the supplier/provider. In Angularjs, provider is encapsulated in the form of a JavaScript class (constructor).
Service names are typically identified by a string, such as "$http" represents the HTTP invocation service, "$rootScope" represents the root scope object, "$compile" represents the build service ...
The provider class requires a $get function (class factory), and injector can obtain an instance of the serviced component by invoking the function.
The combination of name and class function information is called a recipe. A centralized recipe library is maintained in injector to create different components on demand. This recipe library, in fact, is a hash object, key is the service name, value is the class definition.
Example: Registering a Hello service on the test module
//Registering a Hello service on the test moduleAngular.module ("Test", []). Provider ("Hello",function(){ //$get method is a class factory that returns an instance of the service This. $get =function(){ return"Hello,world!"; };}); Angular.element (document). Ready (function() {Angular.injector (["Ng", "Test"]). Invoke (function(hello) {//turns the Hello instance object into a string display varE = Document.queryselector ("#logger"); Angular.element (E). text (hello); });});Get the Injector Object
Create a new injector
Angular.injector (modules, [STRICTDI]);
Get an injector that has already been created
Invoking the API via the injector1 var element = angular.element (dom_element); 2 var injector = Element.injector ();
The injector has two methods to make API calls: Invoke () and get ().
Invoke ()
Using the Invoke () method of the injector, you can invoke a user-defined function body directly and inject the dependent service object through the function parameters, which is the usage of ANGULARJS recommendations and conventions:
1 angular.injector ([' ng '])2 . Invoke (function($http) {3 // Do sth. with $http 4 });Get ()
Get () method to get the service instance with the specified name:
1 var my$http = Angular.injector ([' ng ']). Get (' $http '); 2 // Do sth. with My$httpThere are two ways to tell the injector that a service object needs to be injected: parameter name injection and dependency array injection.
Parameter name injection:
Converts the function definition to be injected into a string and checks its parameter table with a regular expression
1 // MyFunc This function is dependent on the "$http" service through the parameter table 2 var function ($http) {3 // Do sth. with $http 4 }; 5 Injector.invoke (MYFUNC); // the definition of MyFunc will be converted to a string for parameter name checkingDependency array Injection
The last item in the array is the actual function to execute, and the other items indicate the name of the service that needs to be injected into the function. The injector will inject the dependent object into the function in the order of the array, in turn
1 // MyFunc relies on "$http" and "$compile" services 2 var myfunc = ["$http", "$compile",function(P1,P2) {3 //dosth. With P1 ($http), p2 ($compile)4}]; 5 Injector.invoke (MYFUNC);(v) Angularjs-Dependency Injection
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
