Javascript 试图使ngTable与来自我的API的数据一起工作
我有一个Javascript 试图使ngTable与来自我的API的数据一起工作,javascript,angularjs,ngtable,Javascript,Angularjs,Ngtable,我有一个工厂内部的函数 API.doRetrieveResults = function(name, id, values, row) { // alert(angular.toJson(values)); var getdata = { 'operation': 'RetrieveResults', 'name': name, 'ds_blockid': id, 'values': angular.toJson(values), 'row':
工厂内部的函数
API.doRetrieveResults = function(name, id, values, row) {
// alert(angular.toJson(values));
var getdata = {
'operation': 'RetrieveResults',
'name': name,
'ds_blockid': id,
'values': angular.toJson(values),
'row': row
};
return $http({
method: 'GET',
url: _myurl,
params: getdata
});
};
这将返回一个包含超过6K条记录的数组
我想要的是使用ngTable显示它
我试过做类似的事情
$scope.tableParams = new NgTableParams({
page: 1, // show first page
count: 10 // count per page
}, {
filterDelay: 300,
getData: function(params) {
return API.doRetrieveResults($scope.module, $scope.id, $scope.values, $scope.row).then(function(response) {
params.total(response.data.result.records.inlineCount);
return response.data.result.records;
});
}
});
即使在观看chrome开发者工具上的网络标签时,我能看到数据的到来,但我的表格上从来没有显示任何内容
另一方面,像这样的事情
$scope.tableParams = new NgTableParams({
page: 1, // show first page
count: 10 // count per page
}, {
filterDelay: 0,
getData: function($defer, params) {
API.doRetrieveResults($scope.module, $scope.id, $scope.values, $scope.row).then(function(response) {
$scope.totalData = response.data.result.total;
$scope.data = response.data.result.records;
var orderedData = params.filter ?
$filter('filter')($scope.data, params.filter()) : $scope.data;
params.total($scope.totalData); // set total for recalc pagination
$defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
});
}
});
将工作,各种值将显示在表中,但每次尝试更改页面时,我都会看到对API的调用再次完成,我必须再次等待所有数据的到来
如何正确解决此问题,最好是加载一次数据,然后将所有内容传递到ngTable以显示。页面更改时调用什么函数? $scope.data中已经有所有行 这是一个你如何做到这一点的例子, 在我的服务中,我调用Web服务并检索由searchtext筛选的项目:
$scope.data=[];
$scope.dataFiltered=[];
$scope.page=1;
$scope.numPages=0;
$scope.rowsPerPage=10;
$scope.numdata=0;
$scope.searchData=函数(){
$scope.data=[];
$scope.dataFiltered=[];
$scope.page=1;
$scope.numPages=0;
//$pageLoadingBar.showLoadingBar();
//调用API一次检索所有数据
YourApiFactory.findData($scope.searchText.value,
函数(dataFound){
$scope.data=dataFound;
$scope.numdata=dataFound.length;
$scope.numPages=Math.ceil($scope.numdata/$scope.rowsPerPage);
//显示从到的数据
$scope.dataTo=$scope.page*$scope.rowsPerPage;
$scope.dataFrom=$scope.filesTo-$scope.rowsPerPage;
$scope.updateDataable();
//$pageLoadingBar.hideLoadingBar();
});
};
$scope.updateDataable=函数(){
变量begin=($scope.page-1)*$scope.rowsPerPage),
end=begin+$scope.rowsPerPage;
$scope.dataFiltered=$scope.data.slice(开始、结束);
}
$scope.nextPage=函数(){
如果($scope.page<$scope.numPages){
$scope.page++;
$scope.updateDataable();
}
};
$scope.previousPage=函数(){
如果($scope.page>1){
$scope.page--;
$scope.updateDataable();
}
};代码>您好,我没有在页面更改上使用函数,ngTable是。尽管我确信你的答案是有效的,但这并不是我想要的答案,因为我选择了使用ngTable。但是您需要某种分页/过滤。您可以在服务器端或客户端执行此操作。通常,您有一些按钮,用于显示上一页/下一页的内容以及计算要显示的行的行。对于ngTable,这些信息位于ngTable参数中。我建议您阅读其中的文档,其中说明您可以将整个阵列和数据传递给ngTableParams,请参阅。因此,加载数据一次并将其传递给ngTableParams。