javascript - angular ng-repeat filter

问题描述

问 题

 <input type="text" ng-model="search">
  <div class="selectContain">
    <ul class="searchSelect" ng-show="showList">
      <li ng-repeat="item in items | filter:{name:search}" >{{item[name]}}</li>
    </ul>
  </div>
  
 想去对items进行筛选，但是不确定筛选 items中的哪个属性。也就是说，可以把name写成变量的形式吗。
 即filter:{name:search}"  中的name为变量怎么去写。

解决方案

写了个demo

http://embed.plnkr.co/eRxymEa...

列表过滤

核心代码：

      <ul class="searchSelect">
        <li ng-repeat="item in items | filter: myFilter">{{ item.name }}</li>
      </ul>
      
      
      angular.module('myapp').controller('myController', function($scope) {
          $scope.search = "";
          $scope.filterName = "name";    // 传入要过滤的属性名
          $scope.items = [{
            name: 'wws',
            age: 1
          }, {
            name: 'A',
            age: 2
          }, {
            name: 'B',
            age: 3
          }];
          $scope.myFilter = function(item) {
            return item[$scope.filterName] == $scope.search;
          }
       })

如果想搜索条件为空显示全部，只要把过滤函数改成：

  $scope.myFilter = function(item) {
      return !$scope.search || item[$scope.filterName] == $scope.search;
  }

这篇关于javascript - angular ng-repeat filter的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！