刚刚看了网上的一些关于控制器之间的通信；然后结合自己项目做了一些，这里主要做的是二个同级之间的controller通信。
Html：
1 <html>
2 <script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script>
3 <body>
4 <div ng-app="app">
5 <div ng-controller="childCtr1">name :
6 <input ng-model="name" type="text" />
7 </div>
8 <div ng-controller="childCtr2">Ctr1 name:
9 {{ctr1Name}}
10 </div>
11 </div>
12 </body>
13 </html>
上面的html代码设置了2个同级的控制器，现在childCtr2需要childCtr1的参数来显示相关信息，下面是控制器childCtr1的代码：
1 angular.module("app", [])
2 .controller("childCtr1", function ($scope) {
3 $scope.$watch("name",function (){//监听绑定“name"，当发生改变时发送消息；
4 //alert("123");
5 $scope.$emit("Ctr1NameChange", $scope.name);//发送名为Ctr1NameChange的消息，值为$scope.name
6 });
7 });
下面是childCtr2的代码：
angular.module("app", [])
.controller("childCtr2", function ($scope) {
$scope.$on("Ctr1NameChange",//监听有没有名为”Ctr1NameChange“的消息，如果有，则执行下面函数
function (event, msg) {
console.log("childCtr2", msg);
$scope.ctr1Name = msg;
});
});
以上是针对控制器分离的文件写的不同形式；当然也可以将他们合并到一个页面
1 angular.module("app", [])
2 .controller("childCtr1", function ($scope) {
3 $scope.$watch("name",function (){
4 //alert("123");
5 $scope.$emit("Ctr1NameChange", $scope.name);
6 });
7 }).controller("childCtr2", function ($scope) {
8 $scope.$on("Ctr1NameChange",
9
10 function (event, msg) {
11 console.log("childCtr2", msg);
12 $scope.ctr1Name = msg;
13 });
14 });
还有很多控制器之间的通信方法，包括server的factory，可以参考：http://jsbin.com/hopazo/5/edit?html,css,js,output
时间： 2024-08-05 02:24:02