如何在AngularJS中将消息从一个控制器发送到另一个控制器？

Question

我有以下设置:

stApp.controller('AdminTableController', ['$rootScope', '$scope', 'gridService', 
            function ($rootScope, $scope, gridService) {
    $scope.$watch('tableData.$pristine', function (newValue) {
        $rootScope.broadcast("tableDataUpdated", {
            state: page.$pristine
        });
    });
}])

stApp.controller('AdminGridController', ['$rootScope', '$scope', 'gridService',
            function ($rootScope, $scope, gridService) {
    $rootScope.on("tableDataUpdated", function (args) {
        //args.state would have the state.
        alert(args.state);
    });
}])

当我运行此代码时,我收到一条消息:

Object #<Object> has no method 'on'

请注意,我尝试使用$ rootScope.on和$ scope.on

Answer 1

你必须有意思$broadcast和$on(而不是broadcast和on),那就是:

$rootScope.$broadcast("tableDataUpdated", { state: page.$pristine });
// ...
$rootScope.$on("tableDataUpdated", function (args) {
// ...

值得注意的是,$broadcast用于将事件委托给子或兄弟范围,而$emit将事件向上传递给范围的父母,因此;

当选择$broadcast(而不是$emit),你要么注入搭售的根范围内$on(如你很好做),或致电$on接收器上的隔离范围,无论是调度员的一个子范围.

请参阅此文章以详细说明$emit和$broadcast.

Answer 2

如果事件侦听器位于子范围内:$scope.$broadcast('MyEvent', args);

如果事件侦听器位于父作用域中:$scope.$emit('MyEvent', args);

你可以通过在$ rootScope上使用$ broadcast来避免任何混淆,因为$ rootScope是Angular应用程序中所有作用域的父级: $rootScope.$broadcast('MyEvent', args);

无论您使用$ emit还是$ broadcast,接收控制器都会监听 $scope.$on('MyEvent', function() {});