angular 控件间的通信
先引入
设置meta元素
http://blog.sina.com.cn/s/blog_51048da70101cgea.html
//设置 虚拟窗口的大小等于设备的大小
<meta name="viewport" content="width=device-width, user-scalable=no,init-scale=1.0, maximun-scale=1.0, minimun-scale=1.0">
//格式检测
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
//引用 angular.min.js
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
//代码如下
<!doctype html>
<html lang="en" ng-app="myapp">
<head>
<meta charset="UTF-8">
<title>控制器间的通信</title>
</head>
<body>
<div ng-controller="main">
main controller
<div ng-controller="child">
child controller
</div>
<button ng-click="broadcast()">$broadCast</button>
</div>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript">
var myapp=angular.module("myapp",[]);
myapp.controller("main",function($scope,$rootScope){
var name = "var main->child";
$scope.name="main";
$rootScope.age = 18; //ng-app 全局
//父级发送接收信息事件
$scope.$on("childData",function(e,d){ //event事件 data数据
console.log(e.targetScope) //获得子控件的 $scope
})
$scope.broadcast=function(){
$scope.$broadcast("mainData",name)
}
})
myapp.controller("child",function($scope,$rootScope){ //$scope 作用域
var name = "var name->child";
$scope.name="child";
console.log($rootScope) // 18
//子级控件 收发信息事件
$scope.$on("mainData",function(e,d){
console.log(d)
})
$scope.$emit("childData","发送给父控件")
})
</script>
</body>
</html>
//访问不同作用域的变量
//方法一
//知识点： $scope是当前controller控制器下的作用域
// $rootScrope ng-app 下的作用域
//方法二
// $on 监听事件 $emit子控件向父控件发送事件 $broadcast 向子控件发送信息时需谨慎(所有的子控件都可以收到)
//e.targetScope 获得事件发送的主体scope作用域
