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も参照してください。