ngtable服务器端分页

Question

您好我试着弄清楚如何使用angularjs进行服务器端分页.

我有两个网络服务:

localhost:8080/app/api/period方法GET返回json实体列表.当参数传递页码时,开始时间范围和停止时的范围.

localhost:8080/app/api/period/count方法GET返回周期计数.当参数通过启动周期范围和停止时的范围.

    this.tableParams = new ngTableParams({
        page: 1,
        count: 10
    }, {
        counts: [10],
        total: 0,
        getData: function($defer, params) {
            $http.get('/app/api/period', {params: {
                pageNumber:params.page() - 1,
                rangeStart:rangeStart,
                rangeStop:rangeStop}})
                .success(function(data, status) {

                   params.total($http.get('/app/api/period/count', {params: {
                        rangeStart:rangeStart,
                        rangeStop:rangeStop}}));

                   $defer.resolve(data);
                });
        }
    });

表params.total未进行核心更新,因此会显示表中的数据,但不会显示分页按钮.

任何人都可以解释我如何在这种情况下使用$http.get其他成功监听器内部$http.get来正确设置params.total.

Answer 1

你没有看到分页按钮,因为你的get()可能会因为你在服务器端的"rangeStart","rangeStop"限制而返回10,如果你从10个总数中返回10个结果,则没有任何分页.

每个请求可以返回10个结果,但params.total应该始终是所有结果的计数.

无论如何你不需要2个get()调用,你可以用这样的方式返回它:D

{
    "results": [
        {
            "id": "1437",
            "task_started_at": "2014-06-09 12:25:25",
            "task_finished_at": "2014-06-09 12:25:25"
        },
        {
            "id": "1436",
            "task_started_at": "2014-06-09 12:26:31",
            "task_finished_at": "2014-06-09 12:26:31"
        }
    ],
    "total": 1027
}

你的代码看起来像这样:

params.total(data.total);
$defer.resolve(data.results);

而且你也不需要总数,因为你会从服务员那里得到它所以删除:

total: 0;

最后你的代码与2 get()调用看起来像这样:

this.tableParams = new ngTableParams({
        page: 1,
        count: 10
    }, {
        getData: function($defer, params) {
            $http.get('/app/api/period', {params: {
                pageNumber:params.page() - 1,
                rangeStart:rangeStart,
                rangeStop:rangeStop}})
                .success(function(data, status) {

                   params.total($http.get('/app/api/period/count'));

                   $defer.resolve(data);
                });
        }
    });

where $http.get('/app/api/period/count')返回总记录数1234

祝好运