AngularJS在控制器之间共享数据

本·基拉(Ben Kilah)

我有一项从服务器中获取一些客户端数据的服务:

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);
});

我现在只是提醒,但从未触发过。页面最初加载时,它会发出“未定义”的警报。我在控制台中没有错误,并且所有$ injects都很好,但是似乎从未意识到服务中的数据已更改。我在手表上做错了吗?

非常感谢本

布雷特·亨德森(Brett Henderson)

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 ) { });

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在控制器AngularJS之间共享数据

来自分类Dev

在控制器之间共享数据,AngularJS

来自分类Dev

AngularJS:在控制器之间共享数据的工厂

来自分类Dev

使用AngularJS工厂在控制器之间共享数据

来自分类Dev

AngularJS:在指令和外部控制器之间共享数据

来自分类Dev

控制器之间通过服务共享数据(AngularJS)

来自分类Dev

AngularJS在控制器之间共享异步服务数据

来自分类Dev

angularjs在控制器之间共享数据配置

来自分类Dev

如何在AngularJS控制器之间正确共享数据?

来自分类Dev

使用服务在控制器之间共享数据(AngularJS)

来自分类Dev

angularjs-通过服务在控制器之间共享数据

来自分类Dev

AngularJS使用$ broadcast帮助在控制器之间共享数据

来自分类Dev

控制器之间的共享状态-angularjs

来自分类Dev

AngularJS在控制器之间共享方法

来自分类Dev

AngularJS在指令之间共享控制器

来自分类Dev

在控制器之间共享AngularJS工厂

来自分类Dev

在控制器AngularJS之间共享功能

来自分类Dev

控制器之间的共享状态-angularjs

来自分类Dev

在控制器之间共享数据[数组]

来自分类Dev

在控制器之间共享数据[数组]

来自分类Dev

在控制器之间共享模型数据

来自分类Dev

在AngularJs的控制器之间传递数据

来自分类Dev

使用Angularjs在2个不同页面的控制器之间共享数据

来自分类Dev

如何在angularjs中的两个控制器之间共享数据

来自分类Dev

AngularJS在工厂和控制器之间跨模块共享数据

来自分类Dev

如何在AngularJS中的各个控制器之间共享数据?

来自分类Dev

angularjs-在2个控制器之间共享服务的数据

来自分类Dev

控制器之间共享数据,Angularjs 1.3版本

来自分类Dev

AngularJS:通过父控制器在兄弟指令之间共享数据的最佳实践

Related 相关文章

  1. 1

    在控制器AngularJS之间共享数据

  2. 2

    在控制器之间共享数据,AngularJS

  3. 3

    AngularJS:在控制器之间共享数据的工厂

  4. 4

    使用AngularJS工厂在控制器之间共享数据

  5. 5

    AngularJS:在指令和外部控制器之间共享数据

  6. 6

    控制器之间通过服务共享数据(AngularJS)

  7. 7

    AngularJS在控制器之间共享异步服务数据

  8. 8

    angularjs在控制器之间共享数据配置

  9. 9

    如何在AngularJS控制器之间正确共享数据?

  10. 10

    使用服务在控制器之间共享数据(AngularJS)

  11. 11

    angularjs-通过服务在控制器之间共享数据

  12. 12

    AngularJS使用$ broadcast帮助在控制器之间共享数据

  13. 13

    控制器之间的共享状态-angularjs

  14. 14

    AngularJS在控制器之间共享方法

  15. 15

    AngularJS在指令之间共享控制器

  16. 16

    在控制器之间共享AngularJS工厂

  17. 17

    在控制器AngularJS之间共享功能

  18. 18

    控制器之间的共享状态-angularjs

  19. 19

    在控制器之间共享数据[数组]

  20. 20

    在控制器之间共享数据[数组]

  21. 21

    在控制器之间共享模型数据

  22. 22

    在AngularJs的控制器之间传递数据

  23. 23

    使用Angularjs在2个不同页面的控制器之间共享数据

  24. 24

    如何在angularjs中的两个控制器之间共享数据

  25. 25

    AngularJS在工厂和控制器之间跨模块共享数据

  26. 26

    如何在AngularJS中的各个控制器之间共享数据?

  27. 27

    angularjs-在2个控制器之间共享服务的数据

  28. 28

    控制器之间共享数据,Angularjs 1.3版本

  29. 29

    AngularJS:通过父控制器在兄弟指令之间共享数据的最佳实践

热门标签

归档