$scope.on 不听 $emit 和 $broadcast

Question

我无法让控制器收听任何发出或广播的消息。我也尝试过使用 $rootScope，但仍然无法正常工作。

<div ng-controller="MainCtrl">
  <p>Hello {{name}}!</p>
</div>
<div ng-controller="Controller1">
  <p>Hello {{name}}!</p>
</div> 

app.controller('MainCtrl', function($scope) {
  $scope.name = 'SomeName';
  $scope.$broadcast($scope.name, "Hello");
});

app.controller('Controller1', function($scope) {
  $scope.name = 'SomeName';
  $scope.$on($scope.name, function(event,data) {
    console.log("identified"); 
    console.log("data");
  });
});

演示：http://plnkr.co/edit/E95Ucn5Xa9zauwg4dsIA?p=preview

Answer 1

首先，由于 $broadcast 将事件向下发送到子作用域，您需要将 Controller1 嵌套在 MainCtrl 下以实现您的工作方法。

<div ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <div ng-controller="Controller1">
        <p>Hello {{name}}!</p>
    </div>
</div>

第二个细微差别是您正在尝试立即在 MainCtrl 控制器中广播事件，但是此时 $scope.$on 尚未在 Controller1 中注册，因此在这种方式没有什么意义，因为还没有什么可以处理的。但为了演示，如果您在超时后或在 ngClick 上广播事件，您会看到它正常工作。

演示：http://plnkr.co/edit/wo1IHggq9CiDHPVcgB4C?p=info

Answer 2

选项 B

如果你想在兄弟控制器之间广播事件，你可以使用 $rootScope 和 @dfsq 中的其他答案

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $rootScope, $timeout) {
  $scope.name = 'SomeName';
  $timeout(function() {
    $rootScope.$broadcast($scope.name, "Hello");
  }, 1);
});

app.controller('Controller1', function($scope) {
  $scope.name = 'SomeName';
  $scope.$on($scope.name, function(event, data) {
    console.log("identified");
    console.log("data");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>

<body ng-app="plunker">
  <div ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
  </div>
  <div ng-controller="Controller1">
    <p>Hello {{name}}!</p>
  </div>
</body>

Answer 3

It needs Parent-> Child or Child-> Parent relationship but you are creating two isolated Divs.

嵌套一个就可以了。

<div ng-controller="MainCtrl">
  <p>Hello {{name}}!</p>
  <div ng-controller="Controller1">
    <p>Hello {{name}}!</p>
  </div>
</div>

此处 MainCntrl 将成为 Controller1 的父级

或者

<div ng-controller="Controller1">
      <p>Hello {{name}}!</p>
      <div ng-controller="MainCtrl">
        <p>Hello {{name}}!</p>
      </div>
    </div>

这里Controller1将是MainCntrl的Parent controller

$scope.on 不听 $emit 和 $broadcast

$scope.on not listening to $emit and $broadcast

angularjs

演示：http://plnkr.co/edit/wo1IHggq9CiDHPVcgB4C?p=info