Angular-ui-grid分页控件未显示

时间:2017-01-12 20:44:23

标签: javascript angularjs pagination angular-ui angular-ui-grid

我使用以下控制器和html配置来创建一个分页的ui-grid:

   app.controller('AdminProspectGridCtrl', function ($scope, $http, uiGridConstants) {

        $scope.gridOptions = {
          data: 'myData',
          paginationPageSizes: [25, 50, 100, 500],
          paginationPageSize: 25,
          enablePagination: true,
          enablePaginationControls: true,
          enableFiltering: true,
          enableColumnResizing: true,
          enableGridMenu: true,
          columnDefs: [
            { field: 'company'},
            { field: 'email'},
            { field: 'country'},
            { field: 'companySize'},
            { field: 'phone' },
            { field: 'dateCreated', cellFilter: 'date:"medium"' },
          ]
        };

        // Retrieve server data
        $http.get('/api/admin/test').then(function (response) {
                $scope.myData = response.data;
            }, 
            function (error) {
                console.log(error);  
        });
  });

HTML代码:

<link rel="stylesheet" href="/bower_components/angular-ui-grid/ui-grid.css" />
<script src="/bower_components/angular-ui-grid/ui-grid.js"></script>

  <div class="tile-body" ng-controller="AdminProspectGridCtrl">

    <div id="grid" ui-grid="gridOptions" ui-grid-pagination class="grid"></div>

  </div>

分页控件根本不会出现在屏幕上。帮助赞赏。

1 个答案:

答案 0 :(得分:0)

我通过向模块添加'ui.grid.pagination'依赖关系解决了类似的问题

var app = angular.module('app', [
    'ui.grid',
    'ui.grid.pagination'
]);

我的版本是

"angular-ui-grid": "^4.8.0",

与此处的另一个问题相同angular-ui-grid pagination missing

希望它解决