【发布时间】：2017-10-03 19:50:23
【问题描述】：
我正在尝试从 http 请求中填充表格。当我单击一个按钮时，我会调用远程加载数据的 showAssociation 函数。我首先在页面加载时创建表（ngTableParams），然后在我的请求中调用重新加载。我可以看到数据已更新，但表格未显示任何内容。我正在使用 ng-table 0.8.3
有什么帮助吗？
这是我的代码
HTML
<table ng-table="assocParams" show-filter="true" class="table table-striped">
<tr ng-repeat="vehiclesRoutesAssociation in vehiclesRoutesAssociations">
<td data-title="'Vehicle Registration'" filter="{ 'vehicleReg': 'text' }" sortable="'vehicleReg'">{{vehiclesRoutesAssociation.vehicleReg}}</td>
<td data-title="'Route Name'" filter="{ 'routeName': 'text' }" sortable="'routeName'">{{vehiclesRoutesAssociation.routeName}}</td>
<td data-title="'Driver Name'" filter="{ 'driverName': 'text' }" sortable="'driverName'">{{vehiclesRoutesAssociation.driverName}}</td>
<td data-title="'Valid from'" >{{vehiclesRoutesAssociation.startDateTime}}</td>
<td data-title="'Valid to'" >{{vehiclesRoutesAssociation.stopDateTime}}</td>
<td class="rowTd">
<div class="pull-right margin-right-10">
<input type=button class="btn btn-primary btn-o btn-sm" id="deleteRowBtn{{vehiclesRoutesAssociation.id}}" value="delete" ng-confirm-click="Are you sure you want to delete this entry from the database?" confirmed-click="deleteAssociation(vehiclesRoutesAssociation.id)">
</div>
</td>
<td class="rowTd">
<div class="pull-right margin-right-10">
<input type=button class="btn btn-primary btn-o btn-sm" id="editRowBtn{{vehiclesRoutesAssociation.id}}" value="edit" ng-click="editAssociation('lg',vehiclesRoutesAssociation)">
</div>
</td>
</tr>
</table> JS
app.controller('vehiclesAssociationCtrl', ["$scope", "$filter", "ngTableParams", "$rootScope", "$modal", "vehiclesManager", function ($scope, $filter, ngTableParams, $rootScope, $modal, vehiclesManager) {
$scope.vehiclesRoutesAssociations = [];
populateAssocTable();
$scope.showAssociation = function () {
if ($('#startDateTimeList').data("DateTimePicker").date() != null && $('#stopDateTimeList').data("DateTimePicker").date() != null) {
$scope.vehiclesRoutesAssociations = [];
// send date in following format 2017-08-25T05_45_36
var from = $('#startDateTimeList').data("DateTimePicker").date();
var to = $('#stopDateTimeList').data("DateTimePicker").date();
var tzoffset = (new Date(from)).getTimezoneOffset() * 60000; //offset in milliseconds
var localISOTimeFrom = (new Date(from - tzoffset)).toISOString().split('.')[0];
tzoffset = (new Date(to)).getTimezoneOffset() * 60000; //offset in milliseconds
var localISOTimeTo = (new Date(to - tzoffset)).toISOString().split('.')[0];
//console.log("localISOTimeFrom" + localISOTimeFrom.replace(/:/g,"_"));
//console.log("localISOTimeTo" + localISOTimeTo.replace(/:/g,"_"));
vehiclesManager.loadVehiclesAndRoutesAssociations(localISOTimeFrom, localISOTimeTo).then(function (assocList) {
if (assocList != null) {
//console.log('GET ASSOCIATION LIST ' + JSON.stringify(assocList));
$scope.vehiclesRoutesAssociations = assocList;
// console.log('GET ASSOCIATION LIST ' + JSON.stringify($scope.vehiclesRoutesAssociations));
$scope.assocParams.reload();
}
});
}
}
function populateAssocTable() {
$scope.assocParams = new ngTableParams({
page: 1, // show first page
count: 100, // count per page
sorting: { Reg: "asc" }
}, {
total: $scope.vehiclesRoutesAssociations.length, // length of data
getData: function ($defer, params) {
console.log('n populateAssocTable getdata length ' + $scope.vehiclesRoutesAssociations.length);
params.data = $scope.vehiclesRoutesAssociations;
// use build-in angular filter
var orderedData = params.sorting() ? $filter('orderBy')($scope.vehiclesRoutesAssociations, params.orderBy()) : $scope.vehiclesRoutesAssociations;
var filteredData = params.filter() ? $filter('filter')(orderedData, params.filter()) : orderedData;
$scope.vehiclesRoutesAssociations = filteredData.slice((params.page() - 1) * params.count(), params.page() * params.count());
params.total(filteredData.length);
// set total for recalc pagination
console.log('n populateAssocTable data length ' + params.data.length);
$defer.resolve($scope.vehiclesRoutesAssociations);
}
});
}
}]);【问题讨论】：
-
控制台有错误吗？
-
完全没有错误。我可以看到 getData 被调用，我手动更新 params.data 但没有别的
标签： javascript angularjs