Обмен данными между контроллерами Angularjs

У меня есть служба, которая извлекает некоторые данные клиента с моего сервера:

app.factory('clientDataService', function ($http) {
    var clientDataObject = {};
    var cdsService = {
        fetch: function (cid) {
            //$http returns a promise, which has a then function, which also returns a promise
            var promise = $http.get('/clients/stats/' + cid + '/').then(function (response) {
                // The then function here is an opportunity to modify the response
                console.log(response);
                // The return value gets picked up by the then in the controller.
                clientDataObject = {'data': response.data, 'currentClientID': cid};
                return clientDataObject;
            });
            // Return the promise to the controller
            return promise;
        }
    };
    return cdsService;
});

Затем в одном контроллере я:

//get stats
clientDataService.fetch($scope.id).then(function (response) {
    $scope.client_data = {
        'statistics': response.data
    }
});

Что все работает очень хорошо. Тем не менее, я пытаюсь сделать часы с другого контроллера на этой службе, чтобы обновить его область при изменении данных, вместо того, чтобы повторно запустить HTTP-запрос:

$scope.$watch('clientDataService.clientDataObject', function (cid) {
    alert(cid);
});

Сейчас я просто предупреждаю, но это никогда не срабатывает. Когда страница изначально загружается, она предупреждает "undefined". У меня нет ошибок в консоли, и все инъекции $отлично, но никогда не кажется, что данные изменились в службе. Я делаю что-то неправильно в часах?

Большое спасибо Бен

Ответы

Ответ 1

clientDataService.clientDataObject не входит в область вашего контроллера, поэтому вы не можете следить за изменениями на этом объекте. Вам нужно ввести $rootScope в свою службу, а затем передать изменения в области контроллеров.

app.factory('clientDataService', function ($rootScope, $http) {
    var clientDataObject = {};
    var cdsService = {
        fetch: function (cid) {
            var promise = $http.get('/clients/stats/' + cid + '/').then(function (response) {
                // The then function here is an opportunity to modify the response
                console.log(response);
                // The return value gets picked up by the then in the controller.
                clientDataObject = {'data': response.data, 'currentClientID': cid};
                $rootScope.$broadcast('UPDATE_CLIENT_DATA', clientDataObject);
                return clientDataObject;
            });
            // Return the promise to the controller
            return promise;
        }
    };
    return cdsService;
});

Затем в контроллере вы можете прослушать изменения, используя:

$scope.$on('UPDATE_CLIENT_DATA', function ( event, clientDataObject ) { });

Ответ 2

Другой подход может быть:

  • определить новую службу

    app.factory('DataSharingObject', function(){
   return {};
}

  • включить эту новую службу в контроллер, где мы хотим сохранить данные

    app.factory('clientDataService', function ($http, DataSharingObject) {
    DataSharingObject.sharedata = ..assign it here
}

  • включить эту новую службу в контроллер, где мы хотим получить доступ к данным

    app.factory('clientReceivingService', function ($http, DataSharingObject) {
   ..use it here... = DataSharingObject.sharedata
}