我如何編寫angularjs過濾器來搜索字符串片段/字符串序列

Question

我正在嘗試編寫一個angularjs自定義過濾器來檢查國家數組是否包含用戶輸入的搜索字符串。該字符串可以由一個字母（例如'E'）或一個n字母的片段（例如'lan'）或整個單詞（例如'England'）組成。在所有情況下，所有包含該單字母或片段的國家都應退還，因此'E'將返回'英格蘭'，'愛沙尼亞'等，而'蘭'將返回'英格蘭'，'愛爾蘭'，等

到目前爲止，我的過濾器返回整個國家或單個字母，但我在使用字符串片段難度：

1. HTML模板：

   <input ng-model="filter.text" type="search" placeholder="Filter..."/> 
   
   <ul> 
       <li ng-repeat="item in data | listfilter:filter.text"> 
   </ul> 
   

2. 個angularJS

   angular.module('sgComponents').filter('listfilter',[ function() { 
   return function(items, searchText) { 
       var filtered = [];    
   
       angular.forEach(items, function(item) { 
        if(item.label === searchText) { // matches whole word, e.g. 'England' 
         filtered.push(item); 
        } 
        var letters = item.label.split(''); 
        _.each(letters, function(letter) { 
         if (letter === searchText) { // matches single letter, e.g. 'E' 
          console.log('pushing'); 
          filtered.push(item); 
         } 
        }); 
        // code to match letter fragments, e.g. 'lan' 
       }); 
       return filtered; 
   }; 
   }]); 
   

Answer 1

它比簡單得多，使用String.indexOf()功能：

angular.forEach(items, function(item) { 
    if(item.label.indexOf(searchText) >= 0) filtered.push(item); 
}); 

您可能需要將兩個字符串.toLowerCase()做區分大小寫的匹配：

searchText = searchText.toLowerCase(); 
angular.forEach(items, function(item) { 
    if(item.label.toLowerCase().indexOf(searchText) >= 0) filtered.push(item); 
}); 

Answer 2

看看的角度-UI-引導指令爲typeahead這不正是你想要什麼：http://angular-ui.github.io/bootstrap/#/typeahead

Answer 3

angular.module('sgComponents').filter('listfilter',[ function() { 
    return function(items, searchText) { 
     var filtered = []; 
     var regex = new RegExp(".*" + searchItem + ".*", "ig"); 
     angular.forEach(items, function(item) { 
      if(regex.test(item)){ 
       filtered.push(item); 
      } 
     }); 
     return filtered; 
    } 
}]);