Невозможно обмениваться данными между контроллерами AngularJS?

Я видел видео http://egghead.io/ об обмене данными между контроллерами, но не смог заставить его работать:

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

myApp.factory('QData', function () {
    return 'hello'
});

function QCtrl($scope, $http, QData) {
  $scope.foo = QData;
}

QCtrl.$inject = ['$scope', '$http', 'QData'];

function YCtrl($scope, $http, QData) {
  $scope.bar = QData;
}

YCtrl.$inject = ['$scope', '$http', 'QData'];

Смотрите код (с дополнительным представлением начальной загрузки), работающий на Plnkr

4 ответа

Решение

Вы должны использовать промежуточный объект и его свойство напрямую.

Вот так.

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

myApp.factory('QData', function () {
    return 'hello' 
});

function ParentCtrl($scope, $http, QData) {   
    $scope.foo = 'My data'; 
}

QCtrl.$inject = ['$scope', '$http', 'QData'];

function QCtrl($scope, $http, QData) {  }

QCtrl.$inject = ['$scope', '$http', 'QData'];

function YCtrl($scope, $http, QData) { }

YCtrl.$inject = ['$scope', '$http', 'QData'];

Если ваша служба меняет QData, а не свойство в QData - Angular теряет ссылку на объект, а другие контроллеры не знают, что происходит.

Подправил ваш код и добавил использование $timeout для имитации чего-то вроде запроса $http, обновляющего ваши QData. Раздвоил свой поршень - но соответствующий JS код ниже.

'use strict';

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

myApp.factory('QData', function () {
    return { text: 'hello' } ;
});

function QCtrl($scope, $http, QData, $rootScope) {
  $scope.foo = QData;
}

QCtrl.$inject = ['$scope', '$http', 'QData', '$rootScope'];

function YCtrl($scope, $http, QData, $rootScope,$timeout) {
  $scope.bar = QData;
  $rootScope.globe = 5;
  $timeout(function()
  {
    QData.text = "Test!"
  },5000);

}

YCtrl.$inject = ['$scope', '$http', 'QData', '$rootScope','$timeout'];

Я думаю, что проблема возникает потому, что ваша фабрика возвращает строку. И строки ведут себя иначе, чем объекты в js (iirc, они заключены в объекты, когда они рассматриваются как они, иначе они являются примитивами). Например

var a = 'hello';
var b = a;
a.x = 1;
console.log(b.x) //undefined

var a = {x: 1}; var b=a; a.y = 1; console.log(b.y); //1

в основном, было бы лучше, если бы вы работали с объектами, как здесь: http://plnkr.co/edit/zqCPn9?p=preview

Другие вопросы по тегам