简体   繁体   中英

Angular search filter on more than one fields

how can i apply search filter on more than one fields using one text box only. My JSON contains Name and IP and some other fields. If i use filter.$ i can get filter on all the fields. And if i use filter.Name i can filter on only one. but i want to filter by two(Name and IP). How should i assign the result to filteredData in getData function??

my code looks like this.

it will be really helpful if someone oculd update the example at embed.plnkr.co/llb5k6/preview

  <input class="form-control main-search" type="text" ng-model="filter.Name" placeholder="enter text to search" /><table ng-table="tableParams" class="table tile">
            <tr ng-repeat="node in $data">

                <td data-title="'Name'" sortable="'Name'">
                    {{node.Name}}
                </td>
                <td data-title="'IP'" sortable="'IP'">
                    {{node.IP }}
                </td>
            </tr>
        </table>

My Js looks like

$http.get('/api/nodesapi').success(function (nodes) {
    $scope.data = nodes;
    $scope.$watch("filter.Name", function () {
        $scope.tableParams.reload();
    });
    $scope.tableParams = new ngTableParams({
        page: 1,            // show first page
        count: 10,          // count per page
        sorting: {
            name: 'asc'
        }
    }, {

        getData: function ($defer, params) {
            debugger;
            var filteredData = $filter('filter')($scope.data, $scope.filter);

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

            $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
        },
        $scope: $scope
    });
}).error(function () {
   $scope.error = "An Error has occured while loading nodes!";});

You can do this:

<input ng-model="query">

then

<tr ng-repeat="node in $data | filter:filterData ">

and in Your js

 $scope.filterData = function (item){
  if (item.name.indexOf($scope.query)!=-1 || item.IP.indexOf($scope.query)!=-1) {
    return true;
  }
  return false;
};

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM