Question

我想使用AngularJS同时使用过滤功能和输入搜索。我可以做多个功能。但是当我添加一个用于搜索的文本框时，我遇到了一些错误。有没有办法做到这一点？我尝试了一些方法，但没有人不工作。

提前致谢。

示例代码如下

   indicatorView.hidden = NO;
  [indView startAnimating];
  [self performSelector:@selector(videoPrepareToPlay) withObject:nil afterDelay:0.2];

var app = angular.module("app", []),
  url = "http://www.filltext.com/?rows=50&pretty=true&fName={firstName}&age=[18,19,20,21]";

app.controller("controller", function($scope, $http) {

  $http.get(url)
    .success(function(resp) {
      $scope.list = resp;
    });

  $scope.filterAge = function(item) {
    return item.age > 19;
  };

});

Answer 1

您应该为角度模块添加自定义过滤器，而不是向控制器添加过滤器功能。这是一个例子：

<强> CustomFilter：

.filter('filterByAge', function filterByAge() {
  return function(array, age) {
    var filteredArray = [];

    angular.forEach(array, function(item) {
      if (item.age > age) {
        filteredArray.push(item);
      }
    });

    return filteredArray;
  }
});

<强> HTML

<input type="text" ng-model="search" placeholder="Search..." />
<table class="table table-striped">
  <thead>
    <th>Name</th>
    <th>Age</th>
  </thead>
  <tbody>
    <tr ng-repeat="item in list | filter: search | filterByAge:19">
      <td>{{ item.fName }}</td>
      <td>{{ item.age }}</td>
    </tr>
  </tbody>
</table>

Answer 2

 $scope.$watch('search', function (data) {
    //sorting logic
})

Watcher正在等待对搜索字段执行的任何操作，然后执行该功能。

AngularJS Filter（函数和输入一起搜索）

2 个答案: