问题描述
您好我试图找出如何与angularjs使服务器端分页的ngtable。
Hello I try figure out how make server side pagination with angularjs an ngtable.
我有两个Web服务:
本地主机:8080 / APP / API /期
方法 GET
实体返回JSON列表。作为参数传递页码,起始时间和范围的范围内,当它停下来。
localhost:8080/app/api/period
Method GET
return json list of entities. As parameters are passed page number, range of start period and range when it stop.
本地主机:周期8080 / APP / API /时间/计数
方法 GET
返回计数。作为参数传递的开始时间和范围的范围内,当它停下来。
localhost:8080/app/api/period/count
Method GET
return count of periods. As parameters are passed range of start period and range when it stop.
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
未更新corectly所以在表中的数据都显示,但分页按钮不可见。
Table params.total
isn't updated corectly so data in table are displayed but pagination buttons aren't visible.
可能有人解释我如何使用 $ http.get
其他成功监听器内 $ http.get
在这种情况下得到正确设置好的 params.total
。
Could anybody explain me how to use $http.get
inside of success listener of other $http.get
in this case to get correctly setted params.total
.
推荐答案
您没有看到分页按钮,因为你的get()可能会返回10,因为在服务器端,如果你的具有rangeStart,RANGESTOP限制计数返回10个结果出来,共10件没有什么可分页。
You don't see pagination buttons because your get() probably returns 10 for count because of your "rangeStart", "rangeStop" limit on server side and if you return 10 results out of 10 total there is nothing to paginate.
您可以返回10个结果,每个请求,但params.total应该永远是所有结果计数。
You can return 10 results per request but params.total should always be count of all results.
反正你不需要2的get()调用时,你可以在一个这样的回报是:D
Anyway you don't need 2 get() calls when you can return it in one like this :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
}
和你code可能是这样的:
And you code could look like this:
params.total(data.total);
$defer.resolve(data.results);
,你也不必总,因为你会得到它从seerver所以删除:
And also you don't need total because you will get it from seerver so remove:
total: 0;
Finaly您code与2的get()调用可能看起来是这样的:
Finaly your code with 2 get() calls could look something like this:
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);
});
}
});
其中, $ http.get('/ APP / API /时间/计数')
返回记录总数像 1234
好运气
这篇关于ngtable服务器端分页的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!