How to render an ngTable without the pagination decorations?

Question

In my small AngularJS app, I render several tables using the ngTable library. Only one could use pagination. The others will always fit on less than a page. Every rendered ngTable seems to add the "10 25 50 100" selector below the table. For most of my tables, this is wasted space and is nonfunctional. How can I remove that section and get that space back?

Answer 1

This was recently fixed (https://github.com/esvit/ng-table/issues/6) This code should do it for you (copied from same git issue):

$scope.tableParams = new ngTableParams({
    count: items.length // hides pager
},{
    counts: [] // hides page sizes
});

Answer 2

Use this approach (based on this link) :

$scope.tableParams = new ngTableParams({
        page: 1,   // show first page
        count: 5  // count per page
    }, {
        counts: [], // hide page counts control
        total: 1,  // value less than count hide pagination
        getData: function($defer, params) {
            $defer.resolve(data);
        }
    });

Answer 3

You could hide it with css:

.ng-table-pager {
    display: none;
}

Answer 4

Override your table declaration by including the attribute template-pagination="custom/pager" This allows you to add pagination around your table, or not include at all.

. . .

Answer 5

$scope.tableParams = new ngTableParams({
    noPager: true // hides pager
},{
    ...
});

after many tries, this method helps me. You can find the condition of pagination control's ng-show is "!noPager" in your dev console.

Answer 6

This worked for me. I called NgTableParams of gridParams and after load data I put

gridParams.total(0);

Answer 7

For completeness, CSS to only hide the pagination immediately following the table:

table.ng-table + div[ng-table-pagination]{
    display: none;
}

Answer 8

This worked for me, very basic using style="display:none".

<mat-paginator style="display:none" [length]="recordCount" [pageSize]="pageSize"></mat-paginator>