AngularJS依赖注入
Posted 随笔
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了AngularJS依赖注入相关的知识，希望对你有一定的参考价值。
AngularJS的依赖注入有两种，一种是显式依赖注入，一种是隐式依赖注入，推荐用显式依赖注入，js压缩后不会因为参数问题而报错
demo6.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="myController">
{{data}}
</div>
<div ng-controller="otherController">
{{otherData}}
</div>
</div>
<script type="text/javascript" src="../common/angular/angularjs.js"></script>
<script type="text/javascript" src="demo6.js"></script>
</body>
</html>
demo6.js
/**
* Created by Administrator on 2017/7/23.
*/
var myApp = angular.module(‘myApp‘, [], function () {
})
//显式依赖注入 myFactory 工厂
.factory(‘myFactory‘, [‘$window‘, function (a) {
console.log("window:" + a);
return "myFactory";
}])
/**
* 1.隐式依赖注入，直接写 function ($scope) 而且参数名称必须是$scope，$scope这个单词不能改
*/
.controller(‘myController‘, function ($scope) {
$scope.data = ‘张三‘;
})
/**
* 2.显式依赖注入 第二个参数用数组 [] 的方式表示，$scope 就是后面functioin的参数a，$filter 就是参数b，多个参数以此类推
* 推荐使用显示依赖注入，一般function(a,b,c)里面的参数名，最好与数组[]前面的变量名一致，方便阅读
*/
.controller(‘myController‘, [‘$scope‘, ‘$filter‘, ‘myFactory‘, function (a, b, c) {
a.data = ‘张三‘;
console.log(a);
console.log(b(‘json‘)([1, 2, 3]));
console.log(c);
}])
/**
* 定义了一个全局的函数 otherController ，可以通过otherController.$inject 的方式 显式依赖注入 $scope ，
* 这里的 a 就是指 $scope
* @param a
*/
function otherController(a) {
a.otherData = ‘李四‘;
}
otherController.$inject = [‘$scope‘];
以上是关于AngularJS依赖注入的主要内容，如果未能解决你的问题，请参考以下文章