如何在 AngularJS 中使用智能 table 显示记录总数

Question

我正在使用 smart-table 来显示记录。使用自定义分页每页显示20条记录。

我想显示如下分页：第 1 - 20 条，共 25 条记录我怎样才能做到这一点？ - 我尝试使用（页数 * 总页数），但这会使结果四舍五入。

Answer 1

您可以使用 tableState.pagination 中的 totalItemCount。从服务器获取数据并在分页模板中使用该值后，只需填充该值即可。

Answer 2

我找到了解决问题的方法。我知道这是一个老问题，但为了让它对其他人更有帮助，我想展示如何让这个解决方案变得更好。

您给出的答案在第一页和后面几页都是正确的，但在最后一页不一定正确。

你这样做：

<span class="pagination-info itemCount">
     {{(currentPage-1)*stItemsByPage+1}}-
     {{currentPage*stItemsByPage}} 
     of {{numPages*stItemsByPage}} Records
</span>

如果最后一页上的记录数少于 stItemsByPage，则永远不会正确。在那种情况下会更好：

<span class="pagination-info itemCount">
     {{(currentPage-1)*stItemsByPage+1}}-
     {{(currentPage*stItemsByPage) > totalItemCount?totalItemCount:(currentPage*stItemsByPage)}} 
     of {{numPages*stItemsByPage}} Records
</span>

Answer 3

首先你应该创建指令

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);
    }
  }
});`

之后你应该在你的视图中使用 "stSummary" 标签。例如：

<st-summary st-items-by-page="10" 
            class="pull-right"
            class="pagination-info itemCountnumber">
</st-summary>`

Answer 4

受 dhiraj tiwari 回答的启发，除非包裹在函数调用中，否则 watch 将无法工作：

  .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)
      }
    }
  })

如何在 AngularJS 中使用智能 table 显示记录总数

How to display total number of records using smart table in AngularJS

pagination

angularjs

smart-table