How to display total number of records using smart table in AngularJS
4 answers
I found this solution for my problem. I know this is an old problem, but to make it more useful to others, I wanted to show you how to make this solution even better.
The answer you gave is correct on the first page and subsequent pages, but not always on the last.
You do it like this:
<span class="pagination-info itemCount">
{{(currentPage-1)*stItemsByPage+1}}-
{{currentPage*stItemsByPage}}
of {{numPages*stItemsByPage}} Records
</span>
If the number of records on the last page is less than stItemsByPage, this will never be correct. In this case, it would be better:
<span class="pagination-info itemCount">
{{(currentPage-1)*stItemsByPage+1}}-
{{(currentPage*stItemsByPage) > totalItemCount?totalItemCount:(currentPage*stItemsByPage)}}
of {{numPages*stItemsByPage}} Records
</span>
+1
source to share
First of all, you must create a directive
ticketsApp.directive('stSummary', function () {
return {
restrict: 'E',
require: '^stTable',
template:'<span><b>[[pagination.start ]] of [[pagination.totalItemCount]] items</b></span>',
scope: {},
link: function (scope, element, attr, ctrl) {
var listener = function (val) {
scope.pagination = ctrl.tableState().pagination;
scope.to = Math.min(scope.pagination.start + scope.pagination.number, scope.total || 0);
};
scope.$watch(ctrl.tableState(), listener, true);
}
}
});`
After that, you must use the "stSummary" tag in your view. Example:
<st-summary st-items-by-page="10"
class="pull-right"
class="pagination-info itemCountnumber">
</st-summary>`
+1
source to share
Inspired by Dhiraj Tiwari's answer, the clock will not work unless it is wrapped in a function call:
.directive('stPaginationSummary', function () {
return {
restrict: 'E',
require: '^stTable',
template: '<span>Showing <strong>{{from}}</strong>-<strong>{{to}}</strong> of <strong>{{total}}</strong> Record(s)</span>',
scope: {},
link: function (scope, element, attr, ctrl) {
var listener = function () {
var pagination = ctrl.tableState().pagination
scope.from = pagination.totalItemCount === 0 ? 0 : pagination.start + 1
scope.to = Math.min(pagination.start + pagination.number, pagination.totalItemCount)
scope.total = pagination.totalItemCount
}
scope.$watch(function () {
return ctrl.tableState()
}, listener, true)
}
}
})
0
source to share