如何在ngTable中过滤

Question

使用Angular,我正在做http请求来获取数据.我添加了ngTable并用它来显示数据.它们正确显示在表格中,但我无法过滤,排序和删除它们.为什么？

JS:

      $scope.cancel = cancel;

function cancel(row, rowForm) {
  var originalRow = resetRow(row, rowForm);
  angular.extend(row, originalRow);
}

$scope.tableParams.reload().then(function(data) {
  if (data.length === 0 && $scope.tableParams.total() > 0) {
    $scope.tableParams.page($scope.tableParams.page() - 1);
    $scope.tableParams.reload();
  }
});

  $http.get('my_url')
.success(function(data, status) {
  $scope.data = data;

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

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

HTML:

    <table ng-table="tableParams" show-filter="true" class="table table-bordered table-striped">
  <tr ng-repeat="row in data track by row.id">
    <td title="'Id'" filter="{id: 'text'}" sortable="'id'">{{row.id}}</td>
    <td title="'Company'" filter="{company: 'text'}" sortable="'company'">{{row.company}}</td>
    <td title="'Email'" filter="{email: 'text'}" sortable="'email'">{{row.email}}</td>
    <td title="'Note'" filter="{note: 'text'}" sortable="'note'">{{row.note}}</td>
    <td>
      <button class="btn btn-default btn-sm" ng-click="cancel(row, rowForm)"><span class="glyphicon glyphicon-remove"></span></button>
    </td>
  </tr>
</table>

Answer 1

您没有在getData方法中应用任何过滤器.

首先,您需要过滤数据,然后排序:

getData: function($defer, params) {
  // I will use a copy of the data to always start with the original data 
  // array ($scope.data). If you are getting the data with $resource or $http
  // you can replace the $scope.data with the data obtained (eg.: response.data)
  var theData = angular.copy($scope.data);

  // First we filter using the filter object provided by the
  // method 'filter()' of ngTableParams instance.
  var filterObj = params.filter(),
      filteredData = $filter('filter')($scope.data, filterObj);

  // Then we sort the FILTERED DATA ARRAY
  // NOTICE that the first parameter provided to $filter('orderBy')
  // is the filtered array <filteredData> and not the original
  // data array.
  var sortObj = params.sorting(),
      orderedData = $filter('orderBy')(filteredData, sortObj);

  // Then we return the final data array (orderedData)
  $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
}