1、注意
1)angularJS里用驼峰 aBc,
则
html 里面就得用中划线a-bc
2)模块依赖
angular.module(‘模块名字’,[‘依赖模块名字1’,’依赖模块名字2’]);// 同名,后面的模块会覆盖前面的模块
2、自定义依赖注入–乱、多
创造依赖
1)最简单–factory
app.xxx('名字',function(){
});
app.factory('fac',function(){
return 内容;
})
2)强大(可配置的)–provider
app.provider('名字',function(){
alert("provider执行了"); // 仅执行一次
this.$get = function(){
alert("$get执行了"); // 仅执行一次
};
})
3)服务–service
app.service('名字',function(){
alert('service 执行了'); // 仅执行一次
this.xxx;
this.yyy;
})
4)constant–常量(不可修改,这里指不可decorator)
app.constant('名字',数据);
app.constant('sum',30);
app.constant('fn',function(){
});
app.constant('json',{
a:'aaa',
b:'bbb'
})
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
var app = angular.module('test',[]);
app.constant("user_sum",function(){alert(30)});
app.controller('con1',function($scope,user_sum){
user_sum()
})
</script>
</head>
<body>
<div ng-app="test" ng-controller="con1">
</div>
</body>
</html>
不可修改示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
var app = angular.module('test',[]);
app.constant("user_sum",function(){alert(30)});
app.controller('con1',function($scope,user_sum){
user_sum = 30;
alert(user_sum); // 30
$scope.xx = function(){alert(user_sum)}
})
app.controller('con2',function($scope,user_sum){
alert(user_sum); // function(){alert(30)}
$scope.yy = function(){alert(user_sum)}
})
</script>
</head>
<body>
<div ng-app="test" ng-controller="con1" >
<input type="button" value="con1Click" ng-click="xx();"/>
<div ng-controller="con2">
<input type="button" value="con2Click" ng-click="yy();"/>
</div>
</div>
</body>
</html>
5)value–变量
app.value('名字',数据);
app.value('sum',30);
app.value('fn',function(){
});
app.value('json',{
a:'aaa',
b:'bbb'
})
3、如何修改依赖
会修改原来的依赖,原来的依赖就变了
// decorator 只执行一次
app.decorator('要修改依赖的名称',function($delegate){
// $delegate 代表了依赖的东西
return 修改后的依赖; // return $delegate;
})
app.value('user_sum',30);
app.decorator('user_sum',function($delegate){
return $delegate + 1; // user_sum 的值会变为31
})
4、总结
1)所有的依赖项只会创建一次,不会创建多次–好事:依赖项的状态在不同的地方是共享的
2)数据共享–多个controller 之间
–父子controller
–无关controller