Eu tenho os seguintes dois controladores peer. Não há pai para estes:
The value of xxx is: {{ xxx }} angular.module('test') .controller('QuestionsStatusController1', ['$rootScope', '$scope' function ($rootScope, $scope) { // How can I set the value of xxx in the HTML that's part of Controller2 }]); angular.module('test') .controller('QuestionsStatusController2', ['$rootScope', '$scope', function ($rootScope, $scope) { }]);
No controlador 1, quero atualizar o valor da variável xxx no HTML controlado pelo Controller2. Existe uma maneira de fazer isso?
Definitivamente, use um serviço para compartilhar dados entre controladores, aqui está um exemplo prático. $ broadcast não é o caminho a percorrer, você deve evitar usar o sistema de events quando houver uma maneira mais apropriada. Use um ‘serviço’, ‘valor’ ou ‘constante’ (para constantes globais).
http://plnkr.co/edit/ETWU7d0O8Kaz6qpFP5Hp
Aqui está um exemplo com uma input para que você possa ver o espelho de dados na página: http://plnkr.co/edit/DbBp60AgfbmGpgvwtnpU
var testModule = angular.module('testmodule', []); testModule .controller('QuestionsStatusController1', ['$rootScope', '$scope', 'myservice', function ($rootScope, $scope, myservice) { $scope.myservice = myservice; }]); testModule .controller('QuestionsStatusController2', ['$rootScope', '$scope', 'myservice', function ($rootScope, $scope, myservice) { $scope.myservice = myservice; }]); testModule .service('myservice', function() { this.xxx = "yyy"; });
Use um serviço para conseguir isso:
MyApp.app.service("xxxSvc", function () { var _xxx = {}; return { getXxx: function () { return _xxx; }, setXxx: function (value) { _xxx = value; } }; });
Em seguida, injetar este serviço em ambos os controladores.
No Controller1, você precisaria definir o valor xxx compartilhado com uma chamada para o serviço: xxxSvc.setXxx(xxx)
Finalmente, no Controller2, adicione um $ watch na function getXxx () deste serviço da seguinte forma:
$scope.$watch(function () { return xxxSvc.getXxx(); }, function (newValue, oldValue) { if (newValue != null) { //update Controller2's xxx value $scope.xxx= newValue; } }, true);
Em um controlador, você pode fazer:
$rootScope.$broadcast('eventName', data);
e ouça o evento em outro:
$scope.$on('eventName', function (event, data) {...});
Você precisa usar
$rootScope.$broadcast()
no controlador que deve enviar dados. E no que recebe esses dados, você usa
$scope.$on
Aqui está um violino que eu bifurquei há pouco tempo (eu não sei quem fez isso primeiro