2016-11-13 5 views
1

Ich versuche, einen Filter zu erstellen, wo ich mehrere Attribute der gleichen Variable bedingt auswählen kann. Zum BeispielAngularjs Filter ODER Bedingungen

var list = [ {id: 1, state: 'U'}, {id: 2, state: 'P'} ]

<div ng-repeat="item in list| filter:{state:'U'}>

Dies würde 1 in id führt nur angezeigt werden.

<div ng-repeat="item in list| filter:{state:'P'}>

Dies würde 2 in id führt nur angezeigt werden.

Wie kann ich einen Filter alle IDs angezeigt, den Staat hat: 'P' OR Zustand: 'A'

Weder der folgenden Arbeit:

<div ng-repeat="item in list| filter:{state:'P' || 'A'}>

<div ng-repeat="item in list| filter:({state:'P'} || {state:'A'})>

+0

Versuchen Sie benutzerdefinierte Filterfunktion, wie http: //stackoverflow.com/a/16479421/5986834 –

Antwort

2

Ich hoffe, dass das unten stehende Code-Snippet Ihnen helfen kann! Führen Sie es :)

var app = angular.module('app', []); 
 
app.controller('Ctrl', function($scope) { 
 

 

 

 

 
    $scope.list = [{ 
 
    id: 1, 
 
    state: 'U' 
 
    }, { 
 
    id: 2, 
 
    state: 'P' 
 
    }, { 
 
    id: 3, 
 
    state: 'A' 
 
    }]; 
 

 
    $scope.state = function(item) { 
 

 

 
    return (item.state == 'P' || item.state == 'A'); 
 

 
    }; 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app" ng-controller="Ctrl"> 
 

 
    <div ng-repeat="item in list | filter:state"> 
 

 
    {{item.id}} 
 

 
    </div> 
 

 
</div>

+0

Dies sollte funktionieren. Ist es möglich, Prädikatfunktionsreferenz direkt inline zu übergeben? –

+0

Ja können Sie, aber die Verarbeitung der Funktion sollte weniger sein, da dies jedes Mal ausgelöst würde, wenn sich etwas in Sicht ändert –

0

Warum so viel Verwirrung haben. Verwenden Sie ng-wenn genau wie Ihre normale if-Anweisung wie diese

var list = [ {id: 1, state: 'U'}, {id: 2, state: 'P'},{id: 1, state: 'A'} ] 
<div ng-repeat="item in list"> 
     <div ng-if="item.state == 'A' || item.state== 'P'"> 
{{item.id}} 
</div> 
</div> 

Implementierung ist auch als unter

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.list = [{id: 1,state: 'U'}, {id: 2,state: 'P'}, {id: 3, state: 'A'}]; 
 

 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <div ng-repeat="item in list"> 
 
    <div ng-if="item.state == 'A' || item.state== 'P'"> 
 
     {{item.id}} 
 
    </div> 
 
    </div> 
 
</div>