问题
I am using np table in angular for data binding. ng table show paging and total number of record but when I add new row or remove one row from data model in ng table.
Total row is reflected but total number of record and paging not reflected.
I have used bleow code Any one can help me..
$scope.viewDeleteTemplateModel = function (templateId, name) {
if (parseInt(templateId, 10) <= 0) {
$scope.bindPopUpMessages(Enum.AlertType.Error, "TemplateId must be greater than zero.");//showing smart popup alert
} else {
$scope.bindSmartAlert("<i class='fa fa-fw fa-reorder'></i> Template", "Do you really want to delete the <strong>" + name + "</strong> template?", function () {
if ($scope.PropertyBag.SmartAlertResult && $scope.PropertyBag.SmartAlertResult === 1) {
var request = "request={'OrganizationId':" + $scope.PropertyBag.OrganizationDetails.OrganizationId + ",'TemplateId':" + templateId + "}";
$RestService.deleteTemplate(request).success(function (result) {
if (result) {
var alertType = Enum.AlertType.Success;
var message = "The Template <strong>" + name + "</strong> is deleted successfully.";
if (result.Result.Status !== 0) {
alertType = Enum.AlertType.Error;
message = "Opps! Something went wrong that's why the template <strong>" + name + "</strong> is not deleted.";
} else {
$scope.tableServerSide[tableId].data.Model.Items = _.without($scope.tableServerSide[tableId].data.Model.Items, _.findWhere($scope.tableServerSide[tableId].data.Model.Items, { TemplateId: templateId }));
if ($scope.tableServerSide[tableId].Records !== undefined && $scope.tableServerSide[tableId].Records > 0)
{
$scope.tableServerSide[tableId].Records = $scope.tableServerSide[tableId].Records - 1;
}
//$scope.getTemplatesList();
}
$scope.bindPopUpMessages(alertType, message);//showing smart popup alert
}
}).error(function (err) { } );
}
});
}
};
And My html code...
<table id="tblTemplate" ng-init="changeTableDropDownPosition();" ng-table="tableServerSide['TemplateList']" class="table table-striped table-bordered table-hover dataTable">
<thead>
<tr>
<th class="text-center">
<div><i class="padding-right-5 fa fa-fw fa-reorder txt-color-blue hidden-md hidden-sm hidden-xs"></i>Name </div>
</th>
<th class="text-center">
<div> <i class="padding-right-5 fa fa-fw fa-calendar txt-color-blue hidden-md hidden-sm hidden-xs"></i> Create On</div>
</th>
<th class="text-center">
<div><i class="padding-right-5 fa fa-fw fa-envelope txt-color-blue hidden-md hidden-sm hidden-xs"></i>Message </div>
</th>
<th class="text-center">
<div> <i class="padding-right-5 fa fa-fw fa-file txt-color-blue hidden-md hidden-sm hidden-xs"></i>File Name</div>
</th>
<th class="text-center">
<div> <i class="padding-right-5 fa fa-fw fa-file-o txt-color-blue hidden-md hidden-sm hidden-xs"></i>File Type</div>
</th>
<th class="width-9">
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="listItem in $data.Model.Items">
<td>{{listItem.Name}}</td>
<td>
{{listItem.CreateUtc | customdateMili | date:'MM/dd/yyyy hh:mm:ss a'}}
</td>
<td>{{listItem.Message | takechar :'25'}}</td>
<td>
<span ng-if="!configuration.UseAwsMedia">
<a class="no-padding btn btn-link fancybox" ng-if="listItem.MediaType === Enum.MediaType.Image"
href="{{DomainPath}}{{listItem.MediaUrl | removestartchars:2}}"
title="{{listItem.Name}}">{{listItem.FileName | takechar:'20'}}</a>
<span ng-if="listItem.MediaType !== Enum.MediaType.Image"> {{listItem.FileName}}</span>
</span>
<span ng-if="configuration.UseAwsMedia">
<a class="no-padding btn btn-link fancybox" ng-if="listItem.MediaType === Enum.MediaType.Image"
href="{{listItem.MediaUrl}}"
title="{{listItem.Name}}">{{listItem.FileName | takechar:'20'}}</a>
<span ng-if="listItem.MediaType !== Enum.MediaType.Image"> {{listItem.FileName}}</span>
</span>
</td>
<td class="text-center">
<span ng-if="listItem.MediaUrl">
<i ng-if="listItem.MediaType === Enum.MediaType.Audio" class="fa fa-file-audio-o"></i>
<i ng-if="listItem.MediaType === Enum.MediaType.Video" class="fa fa-file-video-o"></i>
<i ng-if="listItem.MediaType === Enum.MediaType.Image" class="fa fa-file-image-o"></i>
<i ng-if="listItem.MediaType === Enum.MediaType.Document" class="fa fa-file"></i>
{{GetEnumName(Enum.MediaType,listItem.MediaType,true)}}
</span>
</td>
<td class="text-center">
<button class="btn btn-primary btn-xs" ng-click="viewEditTemplateModel(listItem.TemplateId,listItem.Name)" rel="tooltip" data-placement="bottom" data-original-title="Edit">
<i class="fa fa-pencil"></i>
</button>
<button class="btn btn-primary btn-xs" ng-click="viewDeleteTemplateModel(listItem.TemplateId,listItem.Name)" rel="tooltip" data-placement="bottom" data-original-title="Delete">
<i class="fa fa-trash-o"></i>
</button>
</td>
</tr>
<tr class="odd" ng-if="tableServerSide['TemplateList'].Records !==undefined && tableServerSide['TemplateList'].Records === 0">
<td valign="top" colspan="7" class="dataTables_empty"><strong>No Templates</strong> You don't have any Templates yet.</td>
</tr>
</tbody>
</table>
来源：https://stackoverflow.com/questions/37589187/ng-table-pagenation-not-update-after-delete-or-add-new-record-in-the-data-item