AngularJS: метод $emit, отправляющий дублирующиеся данные

Question

В моем приложении AngularJS у меня есть три контроллера. Один из них является главным контроллером, а два других - братьями и сестрами.

я имею Sibling control 1 излучать данные в Main control, который транслирует данные, которые sibling control 2 затем берет трубку

Брат контроля 1

$scope.selectedPatentFx;

$scope.$watch('selectedPatentFx', function(newValue, oldValue){ 
    if($scope.selectedPatentFx) {
       $scope.$emit('calculateFx', {patentfx: newValue});       
    }
})

Главное управление

$scope.$on('calculateFx', function(event, obj){
    $scope.$broadcast('calculateFxBroadcast', {fx: obj})
}); 

Брат контроля 2

$scope.$on('calculateFxBroadcast', function(event, obj){
   //handle obj
})

Проблема в том, что данные отправляются дважды. Однако это не вызывает никаких ошибок (на данный момент).

Вопрос

Почему данные передаются / транслируются дважды?

Answer 1

Я бы не использовал события ($broadcast) Вот. Вы можете сделать это с помощью службы, которая делится данными. Я создал абстрактный пример, который предоставляет вам базовую обработку.

> Обмен данными через сервис между контроллерами - demo fiddle

Посмотреть

<div ng-controller="MyCtrl">
  <button ng-click="setData()">
        Set data
      </button>
  <h1>
    Controller1
  </h1>
  <hr>
  <p>
    {{data.getContactInfo()}}
  </p>
</div>
<div ng-controller="MyOtherCtrl">
  <br><br>
  <h1>
    Controller2
  </h1>
  <hr> {{data.getContactInfo()}}
</div>

Приложение AngularJS

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

myApp.controller('MyCtrl', function($scope, myService) {

  $scope.data = myService;

  $scope.setData = function() {
    myService.setContactInfo('Hello World');
  }
});

myApp.controller('MyOtherCtrl', function($scope, myService) {
  $scope.data = myService;
});


myApp.service('myService', function() {
    this.contactInfo = '';

    this.setContactInfo = function (data) {
        this.contactInfo = data;
    }

    this.getContactInfo = function () {
        return this.contactInfo;
    }
});