angular中实现控制器之间传递参数的方式

在angular中，每个controller（控制器）都会有自己的$scope，通过为这个对象添加属性赋值，就可以将数据传递给模板进行渲染，每个$scope只会在自己控制器内起作用，而有时候需要用到其他控制器中的数据，这个时候就要考虑到控制器之间参数的传递了。

1.通过$rootscope传参

首先，在angular中存在作用域的继承，继承作用域符合 JavaScript 的原型继承机制，这意味着如果我们在子作用域中访问一个父作用域中定义的属性，JavaScript 首先在子作用域中寻找该属性，没找到再从原型链上的父作用域中寻找，如果还没找到会再往上一级原型链的父作用域寻找。在 AngularJS 中，作用域原型链的顶端是$rootScope，AnguarJS 将会寻找到$rootScope 为止，如果还是找不到，则会返回 undefined。

<div ng-app="app">    <div ng-controller="parent">      {{name}}      <div ng-controller="son">      {{name}}      </div>    </div>  </div>  var app=angular.module("app",[]);  app.controller('parent', ['$scope',function ($scope) {    $scope.name="hello";  }]);  app.controller('son', ['$scope',function ($scope) {    console.log($scope.name);//hello  }]);

在子控制器中打印name，但我们发现在这个控制器中并未为$scope添加name，于是向父作用域查找，发现父作用域存在该属性，所以可以打印出来。

$rootscope 是所有 $scope 的最上层对象,可以理解为一个 Angular 应用中的全局作用域对象。所以为$rootscope添加的属性，在所有的控制器中都可以访问得到。但是为它附加太多逻辑或者变量并不是一个好主意,和js全局污染是一样的.

2.通过事件的方式

首先介绍一下angular中的事件广播：

$on(name,handler) 注册一个事件处理函数，该函数在特定的事件被当前作用域收到（从父级或者子级作用域）时将被调用。

$emit(name,args) 向当前父作用域发送一个事件，直至根作用域。

$broadcast(name,args) 向当前作用域下的子作用域发送一个事件。

name表示事件名称，args表示事件传播的数据，handler表示在接受到传递时要执行的回调，该回调中有event参数，表示事件，有如下方法：

event.targetScope 获取传播事件的作用域 event.currentScope 获取接收事件的作用域 event.name 传播的事件的名称 event.stopPropagation() 阻止事件进行冒泡传播,仅在$emit事件中有效 event.preventDefault() 阻止传播事件的发生   event.defaultPrevented 如果调用了preventDefault事件则返回true

1）子向父控制器传值

<div ng-app="app">    <div ng-controller="parent">      {{name}}      <div ng-controller="son">      {{name}}      </div>    </div>  </div>  var app=angular.module("app",[]);  app.controller('parent', ['$scope',function ($scope) {    $scope.$on('call', function(event,data){      $scope.name=data;      console.log(data);    });  }]);  app.controller('son', ['$scope',function ($scope) {    $scope.name="hello";    $scope.$emit('call', $scope.name);  }]);