javascript - $http.get 同步 AngularJS

Question

你能帮我吗，我是 angularJS 的新手，

我对 Asynchrounous $http.get 有疑问，我解释说:我得到了在 ngTable 中显示的数据，但在我的 html 中我得到了一个空表，直到我点击过滤或排序然后我看到我的数据。

我认为这是因为我在我的 http.get 中有一个 promise 。在这里我的代码可以理解更多(对不起我的英语)

'use strict';
(function() {
    angular
        .module('timeShareApp')
        .controller('homeController', homeController);


    function homeController($http, $scope, $filter, NgTableParams) {

    $scope.users =[];

$http.get('/api/users/').success(function(response) {
            $scope.users = response;

        });

       $scope.usersTable = new NgTableParams({
                page: 1,
                count: 10
            }, {
                total: $scope.users.length, 
                getData: function ($defer, params) {
                      $scope.data = params.sorting() ? $filter('orderBy')($scope.users, params.orderBy()) : $scope.users;
                       $scope.data = params.filter() ? $filter('filter')($scope.data, params.filter()) : $scope.data;
                       $scope.data = $scope.data.slice((params.page() - 1) * params.count(), params.page() * params.count());
                       $defer.resolve($scope.data);
                }
            });





 }

   homeController.$inject = ["$http", "$scope", "$filter", "NgTableParams"];

})();

对于信息:代码工作完美，除了 promise 我想转换为同步，如果你能帮助我的话。

提前致谢

Answer 1

在大多数情况下，没有理由将任何数据保留在 ng-table 的范围之外。我的建议是不要修改或引用任何范围变量，因为这会导致一些很难跟踪的时序问题。

查看非常好的 ng-table 文档，其中大部分都有适用于您的用例的工作示例。 See the docs here

根据过滤/排序发生的位置，您需要对此进行调整，但以下内容应该基本有效:

$scope.loadData = function() { return $http.get('/api/users/') };

$scope.usersTable = new NgTableParams(
  {
    page: 1,
    count: 10
  }, {
    total: 0, // just the inital value - will be updated later on
    getData: function ($defer, params) {
      $scope.loadData().success(function (result) {
        // assuming your result has a total and a data field...

        // update the table params with the total amount of results
        // could also be result.length...
        params.total(result.total);

        // sort and filter your data using the params object here
        var data = result.data;

        // give back the control to the table
        $defer.resolve(data);
      });
    }
  }
);

请注意，每当您的服务器响应时，也要设置 params.total。否则分页将不可见。