Add a feature to hide the pagination about ng-table

[boly38]

On my side, I used this.

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

[freeman42x]

This is what worked for me:

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

[ishamrozeraza]

in my case i had to two tables to work with. under certain condition the one is shown and the other gets hidden and vice versa. and because the pagination div is created outside the table element therefore condition to hide or show a table will only hide or show the table but once the pagination is displayed it wont hide .

So i basically wrapped the whole table in a div and set condition on the div

<div ng-show="(showWaitingList || showAllUsersList) && !availabilityView">
   <table ng-table="tableParams" show-filter="true" class="table" >
   </table>
 </div>
<div ng-show="availabilityView>
   <table ng-table="tableParamsForAvailabilityView" show-filter="true" class="table" >
   </table>
 </div>

may be this solution could help someone..
Thanks.

[dingzhanjun]

I downloaded Hidden pagination control (demo7), it did not work, I have to make this change to make it work, can you explain this? Thanks. By the way, the ngTable is really cool.

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

        $scope.$watch('tableParams', function(params) {
            $scope.users = data.slice((params.page() - 1) * params.count(), params.page() * params.count());
        }, true);

[nwhite89]

Came across the same sort of issue, if you don't want any pagination you can also do count as

count: data.length

This will prevent any pagination at all

[razfriman]

Is there a way to remove the extra space that is still inserted where the pagination controls used to appear?

[dfsq]

@superraz375 you can modify styles of the body element, I believe margin-bottom.

[dfsq]

*tbody, of course.

[viniciuspires]

I think that the actual problem is inserting the whole template when it isn't needed. The template costs an extra HTTP request, extra angular bindings, extra HTML rendering, and extra blank space. In my opinion, this option not only should be available, but it should be the default. Result pagination is an "opt-in-like" feature. @esvit tell me if you agree with me... If you want, I can send you a PR for that.

[penchiang]

boly38: I have been struggling this problem for quite a while. Your answer is the most elegant one when it comes to print out the ng-table screen. Thanks.

[boly38]

@penchiang yes but I agree with @viniciuspires : the best way would be to define this behavior by configuration to avoid extra unwanted stuff ..

[spacentime]

Here is another solution:
On your getData function of the ngTableParams add the code as following
this solution uses the native ngTable pager code

getData: function ($defer, params) {
                        var data = []; /// set the data array to whatever data you have
                        // Do some stuff
                         //
                        params.settings({ counts: data.length > 10 ? [10, 25, 50] : []});
                    }

To disable the pagination you need to set "total" less than "count" and the "counts" equal to an empty array as the below example.

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

here the plunker

[viniciuspires]

@raytracer1975 disabling pagination != hiding pagination.

The feature being requested is actually to don't render the html or display:none when it's not needed, instead of a visibility:hidden-like solution like the current one.

@viniciuspires reading the @anthony-o first comment seems he wanted to disable the pagination and used to hide it by css as a workaround...

[viniciuspires]

@raytracer1975 Yep :) But the thing here is actually like I commented on #6 (comment), there's no actual feature to literally "disable" the pagination. The only thing that happened was that the ng-repeat that loops through the counts array is empty now, and the pager thinks that there's one page only. The css container is still there taking up space, the template is still downloaded and rendered, and the Angular bindings and listeners are still being allocated into memory. A feature to disable pagination would be like:

$scope.tableParams = new ngTableParams({}, {
  paginate: false,
  getData: function($defer, params) {
    $defer.resolve(data);
  }
});

... and just don't render the pagination template at all.

Don't you agree? :)

[viniciuspires]

@esvit I know you closed this issue, but how do you feel about this? PRs are welcome?

[pappucha]

For Hiding the pagination
$scope.tableParams = new NgTableParams({
page: 1, // show first page
count: 10000000 // count per page , Here either put a imaginary count or put maximum number of rows that you have in dataset
//Count:data.count
}, {
total: data.length, // length of data
getData: function ($defer, params) {
// use build-in angular filter
var orderedData = params.sorting() ?
$filter('orderBy')(data, params.orderBy()) :
data;
orderedData = params.filter() ?
$filter('filter')(orderedData, params.filter()) :
orderedData;

            params.total(orderedData.length);
            $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
        }
    });

And in front end
/Below one i have used stop hide the per page data reflection count/
.ng-table-pager {
display: none;
}

[xiaoyuze88]

This works fine for me.

.ng-table.no-pager + div .ng-table-pager {
    display: none!important;
}

Then you can add .no-pager class on the table which you want to hide the pagination.

[FabioT0]

@viniciuspires
Totally agree, very unprofessional behaviour.