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的父控制器

$ scope.on没有收听$ emit和$ broadcast

3 个答案:

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