Question

每10次刷新我的项目大约有1次，我的数据库中的数据没有被检索到，我必须再次刷新页面才能获得它。我尝试在检索数据的函数上添加一个101毫秒的超时，这也有效 - 但也删除了网站的许多其他功能。

问题是有时页面会在检索数据之前加载。

有没有比使用超时更好的解决方法？我的POST代码如下：

 get_data: function (kpi, date_from, date_to, callback) {
        var config = {
            method: 'POST',
            url: '/getData',
            data: {
                kpi: kpi,
                date_from: date_from,
                date_to: date_to
            }
        };
        $http(config)
            .success(function (data) {
                callback(data);
            })
            .error(function (data, status, headers, config) {
                console.log(data, status, headers, config);
            });
    }

然后调用此方法（当前使用超时，这会打破其他网站功能）：

  $scope.update_all_data = $timeout(function(){
    $scope.show_loading = true;
    var date_from = findDateUnix($scope.myDateFrom, $scope.availableDates);
    var date_to = findDateUnix($scope.myDateTo, $scope.availableDates);
    UpdateSvc.get_data($scope.kpi_selected, date_from, date_to, function(res){
        raw_data = [];
        if(res.raw_data != null) {
            if(res.raw_data.length > 0){
                raw_data = res.raw_data;
                skey_data = [];
                if(res.skey_data != null) {
                    skey_data = res.skey_data;
                }
                var num = $scope.show_tab.indexOf(true);

                $scope.filtering = generateCategories();
                $timeout(function(){
                    $scope.display_nodata = false;
                    resizeObjects();
                    $('.md-datepicker-input').prop('disabled', true);

                    //Take out loading
                    $scope.show_loading = false;
                }, 100);
            }else{
                $scope.display_nodata = true;
                $timeout(function(){ $scope.show_loading = false;}, 100);
            }

        }else{               
            $scope.display_nodata = true;
            $timeout(function(){ $scope.show_loading = false;}, 100);
        }
    });
}, 101);

Answer 1

问题是有时页面会在检索数据之前加载。

我不确定你的意思。在AngularJS应用程序中，必须在AngularJS开始工作之前加载整个页面。因此，在页面加载后，您的数据（使用$http进行检索）将始终加载，除非它是在服务器端注入的。

我认为您从$http检索数据时没有任何问题。您可以通过消除或注释掉所有不直接处理数据检索的代码来轻松确认。我还强烈建议进行以下更改：

首先，使用$http的回调是反模式：Why are Callbacks from Promise `.then` Methods an Anti-Pattern

（注意：较新版本的AngularJS使用then/catch代替success/error）

您应该使用内置的承诺系统。调用$http会返回一个可以直接使用的promise对象：

 get_data: function (kpi, date_from, date_to) {
   var config = {
     method: 'POST',
     url: '/getData',
     data: {
       kpi: kpi,
       date_from: date_from,
       date_to: date_to
     }
   };
   // return the $http call
   return $http(config)
     .error(function (data, status, headers, config) {
       console.log(data, status, headers, config);
     });
 }

没有任何理由在$timeout函数中调用update_all_data。您的$http来电已经返回后，您将加入101秒。所做的只是进一步延迟数据的显示。在这里，我们还在服务中success调用返回的承诺上调用$http函数：

  $scope.update_all_data = function(){
    var date_from = findDateUnix($scope.myDateFrom, $scope.availableDates);
    var date_to = findDateUnix($scope.myDateTo, $scope.availableDates);
    UpdateSvc.get_data($scope.kpi_selected, date_from, date_to).success(function(data) {
      console.log(data);
    });
  });

如果这样做并且您的数据被记录了10/10次，则问题不在于数据撤销，而是在update_all_data函数中的其余代码。

有时数据不会从数据库填充

1 个答案: