ng-table pagination, sorting and filter not working

冷暖自知 提交于 2019-12-11 04:12:11

问题


I am trying to use ngTable but its not working as expected. I've implemented pagination, sorting and filter

Here is a plunker i have created.

I have done same way as specified in the docs examples. The pagination, sorting and filter are not working.

I tried to debug but i am not getting any error messages also


回答1:


first inject $filter in controller

controller('DemoCtrl', function($scope, $filter, ngTableParams) {

second, you need to apply ng-repeat to $data variable like this <tr ng-repeat="g in $data">

Update

here working plunk, with all edits above, and angular 1.2.26 and ngtable 0.3.1

Update2

you can bind $scope.tabledata if your view is needed,after data retrieving in getData function

getData: function($defer, params) {
                    // use build-in angular filter
                     filteredData = params.filter() ?
                      $filter('filter')(tabledata, params.filter()) :
                         tabledata;

                    var orderedData = params.sorting() ?
                                        $filter('orderBy')(filteredData, params.orderBy()) : filteredData;
                    var page=orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());
                    $scope.tabledata=page;
                    $defer.resolve(page);
                }



回答2:


I'm using a later version of ng-table but was having similar problems. Apparently you need to add show-filter="true" to the table tag. I didn't see this in the documentation/examples for ng-table but found it in the source code tests.

My Angular Version : 1.2.16
My ng-Table Version : 0.8.3

also tried it with

Angular Version : 1.2.28
ng-Table Version : 0.4.3

HTML

<div class="row">
<div class="col-lg-12">
    <table ng-table="tableParams" show-filter="true" class="table table-condensed table-bordered table-striped">
        <tr ng-repeat="candidate in $data">
            <td data-title="'First Name'" filter="{firstName : 'text'}">{{candidate.firstName}}</td>
            <td data-title="'Last Name'"  filter="{lastName  : 'text'}">{{candidate.lastName}}</
        </tr>
    </table>
</div>

JS Controller

controller: function ($scope, Candidates, NgTableParams) {
            var tableParams = {
                count : 15
            };
            var tableSettings = {

            };
            Candidates.getCandidates().then(function (res) {
                tableSettings.data = res.data._embedded.candidates;
                $scope.tableParams = new NgTableParams(tableParams, tableSettings);
            });
        }


来源:https://stackoverflow.com/questions/26361322/ng-table-pagination-sorting-and-filter-not-working

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!