2016-04-15 6 views
0

Ich sehe ein paar andere Fragen wie diese, aber ihre Antworten funktionieren nicht für mich.Wie filtert man eine Auswahlliste in Angular JS?

Ich habe den folgenden Code, der Daten in einer Tabelle mit AngularJS anzeigt. Ich möchte die Abfrage filtern, um nur die SecurityID-Nummern von 8, 9 und 10 anzuzeigen. Wenn ich den Filter wie unten gezeigt hinzufüge, erhalte ich nichts. Wenn ich den Filter entferne, erscheinen alle Wertpapiere. Was ist der einfachste Weg diesen Filter zu schreiben?

<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>

+0

sollten Sie hierfür einen benutzerdefinierten Filter verwenden. –

Antwort

1

Für einen Filter auf mehrere Werte, empfehle ich Ihnen einen Controller-Funktion zu erstellen, zu filtern.

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

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

Mit diesem Filter in der Ansicht:

<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 Mockup here.

Sie können auch auf this answer verweisen.

+0

Danke für die Antwort, aber ich kann auch nicht funktionieren. Ich weiß nicht warum. Ich habe versucht, einen Haltepunkt in der filterBySecurityId -Funktion zu setzen, aber es trifft nie in den Entwicklertools. –

+0

@SteveGaines Es gibt keinen Fehler in den Konsolenprotokollen? – bviale

+0

Ich glaube, er hat den Funktionsnamen vergessen. Verwenden Sie so ** Filter: filterBySecurityId() ** –

Verwandte Themen