AngularJS 轮询服务未持续更新控制器

AngularJS polling service not continuously updating controller

我正在尝试使用轮询服务不断更新控制器。我的服务正在运行,并且可以验证它正在轮询并正确获取新数据。我无法工作的是更新使用该服务的控制器。

这是我的资料:

cadApp.controller('statsController', function ($scope, DashboardStats) {
    $scope.data = DashboardStats.data.response;
    console.log(JSON.stringify(DashboardStats.data.response));    
});

cadApp.run(function (DashboardStats) { });

cadApp.factory('DashboardStats', function ($http, $timeout) {
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

    var data = { response: {}, calls: 0 };
    var url = "Ajax/CADAjax.aspx";
    var params = { "Command": "GetDashboardStats" };

    var poller = function () {
        $http.post(url, Object.toparams(params))
     .then(function (responseData) {
         data.response = responseData.data[0];

         // This is working
         console.log(JSON.stringify(responseData.data[0]));
         data.calls++;
         $timeout(poller, 10000);
     });
    };
    poller();

    return {
        data: data
    };
});

UI 永远不会使用轮询服务 return 编辑的当前对象进行更新。我的猜测是服务中的 return 语句不正确。它仅 returning 在服务顶部声明的几乎为空的对象。

如何让服务在 http 响应返回时自动更新控制器?

您必须 return 一些数据 - 不要将 timeout 逻辑放在服务中 - 应该包含在控制器代码中。您可以重构以处理控制器中的响应和服务中包含的数据调用:

cadApp.controller('statsController', function ($scope, $timeout, DashboardStats) {
    pollData();

    function pollData() {
        DashboardStats.poll().then(function(data) {
            $scope.data = data;
            $timeout(pollData, 10000);
        });
    }
});

cadApp.factory('DashboardStats', function ($http, $timeout) {
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

    var url = "Ajax/CADAjax.aspx";
    var params = { "Command": "GetDashboardStats" };
    var data = { response: { }, calls: 0 };

    var poller = function () {
        return $http.post(url, Object.toparams(params)).then(function (responseData) {
            data.calls++;
            data.response = responseData.data[0];

            return data;
        });
    };

    return {
        poll: poller
    }
});

您需要在您的工厂中进行回调,然后 return 一个将在您的控制器中使用的函数:

cadApp.factory('DashboardStats', function ($http, $timeout) {
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

    var data = { response: { }, calls: 0 };
    var url = "Ajax/CADAjax.aspx";
    var params = { "Command": "GetDashboardStats" };

    var poller = function (success) {
        $http.post(url, Object.toparams(params)).then(function (responseData) {
            data.response = responseData.data[0];
            success(data);
            data.calls++;
            $timeout(poller, 10000);
        });
    };

    return {
        poller: poller
    };
});

然后在您的控制器中调用 poller 函数并在 success 回调中更新您的范围:

cadApp.controller('statsController', function ($scope, DashboardStats) {
    DashboardStats.poller(function(data) {
        $scope.data = data;
    });
});