injector
描述:
创建一个injector对象, 调用injector对象的方法可以获得angular的service, 或者用来做依赖注入.
使用方法:
angular.injector(modules, [strictDi])
参数详解:
Param Type Details
| modules | Array.<string|Function> |
一组module或者他们的别名. ng module需要显示地申明出来. |
|
strictDi
(optional) |
boolean |
Injector需不需要使用严格模式，即允不允许使用默认别名 (default: false) |
返回值:
Injector对象.
示例代码:
1. 一般情况下次函数用来做单元测试啦, 我这边的示例比较为了示例而示例
<!DOCTYPE HTML>
<html ng-APP="exampleApp">
<head>
<meta http-equiv="content-Type" content="text/html; charset=utf-8" />
<script src="jquery-1.7.2.min.js"></script>
<script src="angular.min.js"></script>
<script>
var exampleApp = angular.module('exampleApp',[]);
exampleApp.controller('exampleController',['$scope', function($scope){
$scope.name = "boyi";
$scope.inject = function(){
var $injector = angular.injector(['ng']);
$injector.invoke(function($http) {
var scopes = angular.element(document.body).scope();
scopes.name = "博弈网络";//这里可以同http请求获得数据
});
};
}]);
</script>
</head>
<body ng-controller='exampleController'>
<p id="test">博弈网络科技</p>
<p>{{name}}</p>
<p><input type="button" ng-click="inject()" value="injector"/></p>
<hr>
</body>
</html>2. 当 Angular的app 已经启动编译好了之后, 有时候你又想强行进入做一些逻辑或者修改，可以使用JQuery/jqLite元素的injector()方法
<!DOCTYPE HTML>
<html ng-app="exampleApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="jquery-1.7.2.min.js"></script>
<script src="angular.min.js"></script>
<script>
var exampleApp = angular.module('exampleApp',[]);
exampleApp.controller('exampleController',['$scope', function($scope){
$scope.addElement = function(){
var p = $('<p ng-controller="MyCtrl">{{content.label}}</p>');
$(document.body).append(p);
angular.element(document).injector().invoke(function($compile){
var scope = angular.element(p).scope();
$compile(p)(scope);
});
}
}]).controller('MyCtrl',['$scope', function($scope){
$scope.content = {"label":"testing"};
}]);
</script>
</head>
<body ng-controller='exampleController'>
<p id="test">博弈网络科技</p>
<p><input type="button" ng-click="addElement()" value="addElement"/></p>
<hr>
</body>
</html>摘自：angular.injector
AngularJS依赖注入常用对象注入器 $injector常用API方法，get、has、invoke
get与has
①has方法的作用是从注册的列表查找对应的服务，如果找到返回true，否则返回false;它的调用格式如下：
injector.has(name)- 1
②get方法的作用是返回指定名称的服务实例，获取到服务的实例对象后，就可以直接调用服务中的属性和方法，它的调用格式如下：
injector.get(name)- 1
为了更深入的理解这两个API的使用方法，我们通过一个简单的示例来演示他们在应用中的使用过程。
③首先，定义一个名为”$custom”的服务，并在该服务中创建一个”print”方法，用于在控制台中输入任意内容;
④然后，调用has方法判断是否存在”$custom”服务；
⑤如果存在，则调用get方法，获取服务的实例对象。并调用该对象的“print”方法输出设定的字符内容。
<!doctype html>
<html ng-app="a4_6">
<head>
<title>has和get方法</title>
<script src="../Script/angular.min.js"
type="text/javascript"></script>
</head>
<body>
<p ng-controller="c4_6">
<!-- 视图组件 -->
</p>
<script type="text/JavaScript">
var a4_6 = angular.module('a4_6', [])
.factory('$custom', function () {
return {
print: function (msg) {
console.log(msg);
}
};
});
var injector = angular.injector(['a4_6', 'ng']);
var has = injector.has('$custom');
console.log(has);
if (has) {
var custom = injector.get('$custom');
custom.print("控制台输出任意的内容！");
}
a4_6.controller('c4_6', ['$scope', '$custom',
function ($scope, $custom) {
//控制器代码
}]);
</script>
</body>
</html>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
invoke方法
invoke方法是一个功能强大的方法，它做常用的场景就是执行自定义函数。除此之外，在执行函数时，还能传递变量给函数本身，他的调用格式如下：
injector.invoke(fn,[self],[locals])- 1
在上述代码中，injector为获取$injector对象，参数fn为需要执行的函数名称，可选项参数self是一个对象，表示用于函数中this变量，可选参数locals也是一个对象，它能为函数中变量名的传递提供方法支持。
例如：
<!doctype html>
<html ng-app="a4_7">
<head>
<title>invoke方法</title>
<script src="../Script/angular.min.js"
type="text/javascript"></script>
</head>
<body>
<p ng-controller="c4_7">
<!-- 视图组件 -->
</p>
<script type="text/javascript">
var a4_7 = angular.module('a4_7', [])
.factory('$custom', function () {
return {
print: function (msg) {
console.log(msg);
}
};
});
var injector = angular.injector(['a4_7', 'ng']);
var fun = function ($custom) {
$custom.print("函数执行成功！");
}
injector.invoke(fun);
a4_7.controller('c4_7', ['$scope', '$custom',
function ($scope, $custom) {
//控制器代码
}]);
</script>
</body>
</html>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
控制台如下：
①在本例代码中，除使用factory方法定义一个名为”custom"的服务之外，还自定义了一个名为fun的函数，并在这个函数中注入custom服务，再调用服务中的”print”方法，向浏览器的控制台输出“函数执行成功！”的字样。
②为了能执行这个自定义函数fun，我们调用$injector中的invoke方法，该方法的功能不仅执行名称对应的函数代码。而且还能返回被执行函数返回的值，而在示例中，仅执行fun函数，将设置的内容显示在浏览器的控制台中，最终执行相关如上图所示。
摘自：AngularJS依赖注入常用对象注入器 $injector常用API方法，get、has、invoke
相关阅读
干货 | 如何写好一篇阅读量10000+的微淘软文？（附赠100条
摘要: 福利：挖到网订阅号(wadaody)后台回复文字“万能标题” 即可免费获得100条万能标题公式 我们都知道淘宝一向比较注
如果你觉得淘宝引流很困难，成本很高。是因为你根本不懂玩淘宝的思路！---题记 今年很多大店死掉了。一些大神也绝迹于淘宝！原因就在
导语：如何充分的利用自媒体平台的推广-如果你只会用微信公众号做推广，那么你太OUT了。流量的时代逐渐转为内容时代，以前有流量就可以
PHP 警告 Warning: Unknown: Input variables exceede
警告全文是这样的：Warning: Unknown: Input variables exceeded 1000. To increase the limit change max_input_vars in php.ini.
网上打字赚钱是真的吗？经常有网友问我这个问题，真真假假我也做过不少分析，相信很多人都看过。对于这个老生常谈的问题，就算分析的再怎