如何过滤Angular JS中的选择列表？

Question

我看到了其他一些类似的问题，但他们的答案并不适合我。

我有下面的代码使用AngularJS在表中显示数据。我想过滤查询，只显示8,9和10的SecurityID号码。当我添加如下所示的过滤器时，我什么都没有。当我删除过滤器时，所有证券都会出现。写这个过滤器最简单的方法是什么？

<div ng-app="myApp"> 
 
     <div ng-controller="SecuritiesCtrl"> 
 
      Select A Forex Pair: 
 
      <select ng-model="SecuritiesModel" ng-options="x.SecurityID as x.TrueSymbol for x in Securities | filter:{ SecurityID: 8,9,10 }" ng-change="GetQuotes();" ng-bind="date | date:'MM/dd/yyyy'"></select><br /> 
 

 
     <table id="QuotesTable" class="MyTable" style="display:none;"> 
 
       <tr> 
 
       <th class="MyTable">Time</th> 
 
       <th class="MyTable">Open</th> 
 
       <th class="MyTable">Hi</th> 
 
       <th class="MyTable">Lo</th> 
 
       <th class="MyTable">Close</th> 
 
       </tr> 
 
       <tr ng-repeat="x in Quotes"> 
 
       <td class="MyTable">{{ x.QuoteTime }}</td> 
 
       <td class="MyTable">{{ x.Open }}</td> 
 
       <td class="MyTable">{{ x.Hi }}</td> 
 
       <td class="MyTable">{{ x.Lo }}</td> 
 
       <td class="MyTable">{{ x.Close }}</td> 
 
       </tr> 
 
      </table> 
 
     </div> 
 
    </div>

Answer 1

对于过滤器上的几个值，我建议你创建一个控制器功能进行过滤。

$scope.interestingSecurityIds = [8, 9, 10]; 

$scope.filterBySecurityId = function(security) { 
    return ($scope.interestingSecurityIds.indexOf(security.SecurityID) !== -1); 
}; 

使用此过滤器视图：

<select ng-model="SecuritiesModel" ng-options="x.SecurityID as x.TrueSymbol for x in Securities | filter: filterBySecurityId" ng-change="GetQuotes();" ng-bind="date | date:'MM/dd/yyyy'"></select> 

的jsfiddle样机here。您也可以参考this answer。