Inferred injection
This injection method requires ensuring that the parameter name is the same as the service name. If the code needs to be compressed, etc., the injection will fail.
app.controller("myCtrl1", function($scope,hello1,hello2){ $scope.hello = function(){ hello1.hello(); hello2.hello(); } });Marker injection
This injection method requires setting a dependency array, which contains the dependency service name. In function parameters, you can set the parameter name at will, but the order consistency must be ensured.
var myCtrl2 = function($scope,hello1,hello2){ $scope.hello = function(){ hello1.hello(); hello2.hello(); } } myCtrl2.$injector = ['hello1','hello2']; app.controller("myCtrl2", myCtrl2);Inline injection
This injection method directly passes in two parameters, one is the name and the other is an array. The last parameter of this array is the real method body, and the rest are all dependencies, but it is necessary to ensure that the parameters in the method body are in the same order (same as mark injection).
app.controller("myCtrl3",['$scope','hello1','hello2',function($scope,hello1,hello2){ $scope.hello = function(){ hello1.hello(); hello2.hello(); } }]);Common methods of $injector
In angular, the injector can be obtained through angular.injector().
var $injector = angular.injector();
Get the dependency service name through $injector.get('serviceName')
$injector.get('$scope')
Get all dependencies of xxx by $injector.annotate('xxx')
$injector.annotate(xxx)
Sample code
<html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script></head><body ng-app="myApp"> <div ng-controller="myCtrl1"> <input type="button" ng-click="hello()" value="ctrl1"></input> </div> <div ng-controller="myCtrl2"> <input type="button" ng-click="hello()" value="ctrl2"></input> </div> <div ng-controller="myCtrl3"> <input type="button" ng-click="hello()" value="ctrl3"></input> </div> <script type="text/javascript"> var app = angular.module("myApp",[]); app.factory("hello1",function(){ return { hello:function(){ console.log("hello1 service"); } } }); app.factory("hello2",function(){ return { hello:function(){ console.log("hello2 service"); } } }); var $injector = angular.injector(); console.log(angular.equals($injector.get('$injector'),$injector));//true console.log(angular.equals($injector.invoke(function($injector) {return $injector;}),$injector));//true //inferred // $injector.invoke(function(serviceA){}); app.controller("myCtrl1", function($scope,hello1,hello2){ $scope.hello = function(){ hello1.hello(); hello2.hello(); } }); //annotated // function explicit(serviceA) {}; // explicit.$inject = ['serviceA']; // $injector.invoke(explicit); var myCtrl2 = function($scope,hello1,hello2){ $scope.hello = function(){ hello1.hello(); hello2.hello(); } } myCtrl2.$injector = ['hello1','hello2']; app.controller("myCtrl2", myCtrl2); //inline app.controller("myCtrl3",['$scope','hello1','hello2',function($scope,hello1,hello2){ // app.controller("myCtrl3",['$scope','hello1','hello2',function(a,b,c){ // a.hello = function(){ // b.hello(); // c.hello(); // } $scope.hello = function(){ hello1.hello(); hello2.hello(); } }]); console.log($injector.annotate(myCtrl2));//["$scope","hello1","hello2"] </script></body></html>The above is a compilation of the information of AngularJS injector. We will continue to add relevant information in the future. Thank you for your support for this website!