Angular中控制器之间的通信

Question

我熟悉以下方法来实现控制器之间的通信.

还有其他人吗？有更好的方法/最佳实践吗？

$broadcast/$emit

.controller("Parent", function($scope){
  $scope.$broadcast("SomethingHappened", {..});
  $scope.$on("SomethingElseHappened", function(e, d){..});
})
.controller("Child", functions($scope){
  $scope.$broadcast("SomethingElseHappened", {..});
  $scope.$on("SomethingHappened", function(e, d){..});
})
.controller("AnotherChild", functions($scope){
  $scope.$on("SomethingHappened", function(e, d){..});
});

或者,从视图:

<button ng-click="$broadcast('SomethingHappened', data)">Do Something</button>

好处:

• 适合一次性活动

缺点:

• 兄弟姐妹之间的不工作,除非一个共同的祖先一样$rootScope,使用

范围继承函数

<div ng-controller="Parent">
  <div ng-controller="Child">
    <div ng-controller="ChildOfChild">
       <button ng-click="someParentFunctionInScope()">Do</button>
    </div>
  </div>
</div>

或者,在代码中

.controller("ChildOfChild", function($scope){
   $scope.someParentFunctionInScope();
});

好处:

• 适用于从上到下的数据传播

缺点:

• 从底部到顶部不太好,因为它需要一个对象(而不是一个原始对象)
• 调用祖先函数会产生紧密耦合
• 兄弟姐妹之间的不工作,除非一个共同的祖先一样$rootScope,使用

范围继承+ $watch

控制器仅响应范围暴露数据的变化,从不调用函数.

.controller("Parent", function($scope){
  $scope.VM = {a: "a", b: "b"};
  $scope.$watch("VM.a", function(newVal, oldVal){
    // react
  });
}

好处:

• 适用于不是由控制器创建的子范围,例如内部 ng-repeat

缺点:

• 对于一次性活动根本不起作用
• 不是很可读的代码

其他值得注意的提及:

• 具有专门功能的共享服务
• 更一般的发布/订阅服务
• $rootScope

Answer 1

正如Samuel所说,使用服务共享数据是一种推荐的方法.这个想法是无论任何控制器如何,数据的状态都是一致的.这两篇文章可以给你一个想法,"如何"和"为什么":共享数据控制器之间,angularjs控制器的状态.

Answer 2

我使用特定于功能的共享服务在控制器之间进行通信.

您可以创建一个通用的共享服务,使其具有订阅和广播事件的中心点,但我发现特定于功能的服务随着时间的推移更容易维护,尤其是在项目和团队增长时.