2014-11-10 2 views
0

Im angularJS를 사용하여 항목 목록을 만듭니다. 이제 여러 개의 열을 동시에 검색 할 수 있도록 필터링하려고합니다. 예를 들어 "Bob"을 검색하면 "Bob"이 포함 된 모든 열이 표시되고 "Bob 073"이라는 이름을 가진 모든 열과 "073"이 포함 된 전화 번호가 계속 검색됩니다 .동시에 여러 열을 필터링하십시오.

비슷한 결과를 얻지 만 특정 열에 하드 코드 된 필터를 만들었고 두 열을 모두 검색하는 경우에만 작동하는 필터를 만들었습니다.

app.filter('appFilter', function() { 
    return function (data, search) { 
     if (!search) { 
      return data; 
     } else { 
      var term = search; 
      var termsArray = term.split(' '); 

      return data.filter(function(item){ 
       return item.name.indexOf(termsArray[0]) > -1 && item.phone.indexOf(termsArray[1]) > -1; 
      }); 
     } 
    } 
}); 

<input type="search" ng-model="search"> 
<div ng-repeat="item in items | appFilter:search)"> 
    {{item.name}}, {{item.phone}} 
</div> 

내가 무슨 뜻인지 이해하시기 바랍니다.

감사합니다.

+0

은 어쩌면 당신은 사용해야 || && –

+0

대신'appFilter'를 사용하여'ng-repeat'를 실행하십시오. –

+0

@Alexander 작동하지 않습니다. 둘 다 true 일 필요가 있습니다. 그렇지 않으면 문자열 중 하나만 검색합니다. – Inzajt

답변

0
myApp.filter('filterMultiple', ['$filter', function ($filter) { 
return function (items, keyObj) { 
    var filterObj = { 
     data: items, 
     filteredData: [], 
     applyFilter: function (obj, key) { 
      var fData = []; 
      if (this.filteredData.length == 0) 
       this.filteredData = this.data; 
      if (obj) { 
       var fObj = {}; 
       if (!angular.isArray(obj)) { 
        fObj[key] = obj; 
        fData = fData.concat($filter('filter')(this.filteredData, fObj)); 
       } else if (angular.isArray(obj)) { 
        if (obj.length > 0) { 
         for (var i = 0; i < obj.length; i++) { 
          if (angular.isDefined(obj[i])) { 
           fObj[key] = obj[i]; 
           fData = fData.concat($filter('filter')(this.filteredData, fObj)); 
          } 
         } 

        } 
       } 
       if (fData.length > 0) { 
        this.filteredData = fData; 
       } 
      } 
     } 
    }; 

    if (keyObj) { 
     angular.forEach(keyObj, function (obj, key) { 
      filterObj.applyFilter(obj, key); 
     }); 
    } 

    return filterObj.filteredData; 
} 
}]); 

사용법 :

arrayOfObjectswithKeys | filterMultiple:{key1:['value1','value2','value3',...etc],key2:'value4',key3:[value5,value6,...etc]} 
+0

[link] (http://jsfiddle.net/9F89Q/109/) –

+0

이렇게하면 searchterms를 사용할 수있는 솔루션을 만들 수있었습니다. 감사! – Inzajt

+0

환영받는 친구 .. –

관련 문제