отправить данные другому контроллеру с помощью $ emit

Question

В моем угловом приложении у меня есть несколько controllers, и мне нужно отправить данные от одного к другому controller, поэтому я использую $scope.$emit для передачи данных, но, к сожалению, он не работает.

var app = angular.module('tApp', []); 
 
app.controller('masterpage', function($scope) { 
 
    $scope.masterpagescope = 'A'; 
 
}); 
 
app.controller('subpage', function($scope) { 
 
    $scope.subpagescope = ['data1', 'data2', 'data2+n']; 
 

 
    $scope.sendData = function() { 
 
    $scope.$emit('send-data', $scope.masterpagescope, $scope.subpagescope); 
 
    console.log($scope.masterpagescope); 
 
    } 
 
    $scope.sendData(); 
 
});

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

 
<div ng-app="tApp"> 
 
    <div ng-controller="masterpage" id="masterpage"> 
 
    {{masterpagescope}} 
 
    <div ng-controller="subpage" id="subpage"> 
 
    {{subpagescope}} 
 
    </div> 
 
    </div> 
 
</div>

В вышеприведенном фрагменте кода я пытаюсь отправить данные $scope.subpagescope «s в $scope.masterpagescope

Answer 1

Вы должны слушать в $ испускают в контроллере Masterpage с помощью $ на

app.controller('masterpage', function($scope) { 
    $scope.masterpagescope = 'A'; 

    $scope.$on('send-data', function(event, data) { 
    $scope.masterpagescope = data; 
    }); 
}); 

app.controller('subpage', function($scope) { 
    $scope.subpagescope = ['data1', 'data2', 'data2+n']; 

    $scope.sendData = function() { 
    $scope.$emit('send-data', $scope.subpagescope); 
    } 
    $scope.sendData(); 
}); 

Рекомендовать this артикул по данному вопросу

Answer 2

Вы не подписались на событие в родительском контроллере.

$scope.$on('send-data', function(event, data){ 
//do whatever with data here... 
}); 

Кроме того, в то время как излучающие, вложить все данные в одном объекте:

$scope.$emit('send-data', {master: $scope.masterpagescope, sub : $scope.subpagescope}); 

PS: Хранить значение, возвращаемое $ на, которая является функцией дерегистрация для подписки на события. Вызовите сохраненную функцию на «destroy» страницы.

Answer 3

У вас должно быть $scope.$on, как и другие ответы.

$scope.$on('send-data', function() { ... }) 

Но я настоятельно рекомендую не с помощью $emit/$broadcast для обмена данными между контроллерами. Обычное Угловое обслуживание улучшится.

---

UPDATE: Почему я не предлагаю использовать $emit/$broadcast?

1. Использование $emit/$broadcast каким-то сложным для начинающих. Вы можете $emit вверх в области углового объема и $broadcast вниз. Если вам нужно общаться с областью одного уровня (sibling), тогда вам нужно будет $emit, а затем $broadcast в родительской области [или использовать $rootScope? - следите за тем, чтобы объект антиобъектива Бога].

2. Каждый $scope.$on регистрирует прослушиватель событий. Его использование может привести к утечке памяти. Конечно, вы можете убить слушателей событий соответственно (дополнительная работа).

3. Код может стать некоторым беспорядком, если их слишком много $emit/$broadcast/$scope.$on s вокруг.