Add Search to ngTable

[rene...@gmail.com]

How can we add a simple search box to use in conjunction with ngTable?


app.controller('ModelPagingCtrl', function ($scope, ngTableParams, $filter, $http, DataService, helloWorldFromService, helloWorldFromFactory) {

  
    DataService.getModels().then(function (data) {
        console.log("GetModels Worked");
        $scope.data = data.d;

        $scope.tableParams = new ngTableParams({
            page: 1,
            count: 10,
            filter: {
                ModelNum: ''
            },
            sorting:
                                {
                                    ModelNum: 'asc'
                                }
        }, {
            total: $scope.data.length, // length of data
            getData: function ($defer, params) {
                // use build-in angular filter
                var filteredData = params.filter() ?
                                $filter('filter')($scope.data, params.filter()) :
                                $scope.data;

                var orderedData = params.sorting() ?
                                $filter('orderBy')(filteredData, params.orderBy()) :
                                $scope.data;

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



        }, function (error) {
            console.log('errror', error);
        });
    });



html


<table class="table" ng-table="tableParams" show-filter="true" >
            <tr ng-repeat="item in $data" >

           
            <td data-title="'ModelNum'" sortable="'ModelNum'" filter="{ 'ModelNum': 'text' }">
                {{item.ModelNum}}               
               
                </td>

            <td><strong>Year:</strong><p>{{item.Year}}</p>
            <strong>Price:</strong><p>{{item.Price}}</p>
            <p>{{item.Features}}</p>
            </td>
           
            </tr>
            </table>

[Karol Siwek]

You use filters in "ng-repeat", like this:

 <tr ng-repeat="item in $data | filter: 'text'" >



check it here: https://docs.angularjs.org/api/ng/filter/filter

[rene...@gmail.com]

Ok Thanks!