Ng-table: 服务器端排序、过滤、分组和分页的示例...

+1

+1

你好，ng-table 这只是客户端库，服务器部分你可以随意制作。 例如，您可以查看这部分代码https://github.com/esvit/bazalt-rest/blob/master/src/Bazalt/Rest/Collection.php#L37 -87

@esvit - 该请求是一个完整的 ng-table 处理服务器端分页、排序、分组、过滤等示例。我同意 ng-table 是客户端库，但这样的示例确实有帮助，因为很多的场景涉及将此客户端库与远程数据一起使用...

@esvit是的，我们想要的只是展示一个人_应该_如何做，即 ng-table 期望什么 JSON 对象？

+1
即使只有一种拦截过滤、排序和分页的点击事件的方法也能帮助我们将其余部分连接到服务器......谢谢

伟大的图书馆顺便说一句...

+1

+1

+1

+1 如果有一些很好的方法可以调用自定义函数进行排序，但不需要它。

在标题中放入 ng-click="sort(vars,directionToggle)" ，您甚至可以启用排序。 只要您的方向切换与其切换匹配，它就会正确显示箭头。
过滤稍微复杂一些，我会说禁用 ng-table 过滤并在标题中添加一个完全自定义的过滤器输入，然后您就不必担心 ng-table 代际。

从那里开始，一切都是关于处理您的后端数据并确保它以正确的顺序向您发送正确的数据。 然后只需插入该数据和 bam，您将拥有一个 ajax 排序/过滤表。

+1

如果这有助于入门，这里有一个服务器端分页示例。 客户端向服务器发送页码和页大小，服务器返回该页的数据行，以及总行数作为响应头。

    $scope.tableParams = new ngTableParams({
      page: 1, count: 10
    }, {
      getData: function($defer, params) {
        var receiveData = function(data, responseHeaders) {
          // in my case, the server returns the total number of rows as a response header
          // call params.total(...) to tell ng-table the total number of rows
          params.total(responseHeaders("count"));

          // the server returns just the data for the current page, so can send it as is
          $defer.resolve(data);
        };

        // getData gets called when you click on a different page in the pagination links.
        // get the page number and size from params.$params
        var pageNumber = params.$params.page;
        var pageSize = params.$params.count;

        // set up the query parameters as expected by your server
        var queryParams = {"paging.pageSize":pageSize, "paging.pageNumber":pageNumber};

        // send an ajax request to your server. in my case MyResource is a $resource.
        MyResource.query(queryParams, receiveData);
      }
    });

希望这对某人有帮助。
甜甜圈

+1

+1

+1

真的很好

我知道这有点晚了，但有人做了一个非常好的显示服务器端排序数据的例子：
https://www.codeproject.com/Articles/892301/Server-side-Data-Filtering-Sorting-and-Paging-with

我不知道我们可以做到这一点。 这在文档中不是很清楚。 :(

嗨，狐狸甜甜圈，
你的评论真的很有帮助，但因为我是新手，我不太清楚
1# 为什么 receiveData 作为参数传递给函数。
当我调用我的 ajax 函数而不是
MyResource.query(queryParams, receiveData);
它正在显示数据，但随着 ajax 稍后返回，计数不会被刷新。 如果我在 ajax 代码中使用重新加载，那么它会进入无限循环:(

嗨@rbhargava25

为什么 receiveData 作为参数传递给函数。

因为MyResource.query是一个异步函数。 它正在向服务器发出请求，当响应返回时，我们需要知道要执行的代码。 在这种情况下，就是调用_callback函数_，即receiveData 。

希望有帮助。

非常感谢Foxdonut...
我将使用简单的 http 请求而不是 Resource 我希望它能工作。