使用 ngTables 生成分页答案

【问题标题】：generate pagination with ngTables使用 ngTables 生成分页
【发布时间】：2017-04-25 17:16:28
【问题描述】：

好吧，我正在尝试生成ngtable，但这不是正确生成分页，我正在按照示例进行操作，但分页对我不起作用，问题是什么：

function usersMainCtrl($scope, NgTableParams, usersFactory)
{
    var tableData = []

    //Table configuration
    $scope.tableParams = new NgTableParams({
        page: 1, // show first page
        count: 5 // count per page
    },{
        //total:tableData.length,
        filterDelay: 300,
        //Returns the data for rendering
        getData : function(params) {
            return usersFactory.getUsers(params.url()).then(function(response) {
                console.log(response);
                console.log(params);
                params.total(response.data.length);
                return response.data;

            });
        }
    });
}

【问题讨论】：

标签： angularjs pagination ngtable

【解决方案1】：

我首先要说我自己是 ngTable 的新手，但我认为问题与您从服务器端获取数据这一事实有关。

我也试图让它工作，并在此处遵循 ngTables 示例： http://ng-table.com/#/intro/demo-real-world

虽然在这个例子中没有说清楚的是，分页也是由服务器处理的（事实上，这个网站的大多数例子都非常糟糕，因为它们使用了未列出的导入代码） .

我解决这个问题的方法是在 NgTableParams 中显式设置返回的数据，然后 ngTable 自己处理分页。这是我拥有的一个表的示例，它从设置为 Angular 工厂的 rest API 中带回一些股票记录 - 这是我的控制器，它很简单，但可以工作：

myApp.controller('stockListController', [
'$scope', '$timeout', '$q', '$http', 'stockList', 'NgTableParams', 
function ($scope, $timeout, $q, $http, stockList, NgTableParams) {
    $scope.loading = true;

   function initTable() {
       stockList.getAll({ url: "localhost:52457"})
            .$promise.then(function (response) {
                $scope.data = response;
                $scope.tableParams = new NgTableParams({
                    count: 2 // size of page
                }, {
                    dataset: response
                });
                $scope.loading = false;
            }, function (response) {
                alert('Rejected');
            });
    }

    initTable();
}

]);

这在您的场景中可能没有用（如果有大量数据，我想加载可能会很慢）但希望它可以为您提供一些工作或其他角度。

【讨论】：