ng-repeat filter "mostra tutto" se nessun filtro selezionato

Question

Ho un filtro ng-repeat che utilizza un menu <select> per filtrare attraverso un gruppo di paesi.

Ad esempio:

<div class="col-md-3 col-sm-6" ng-repeat="item in listings | filter: { location: locationFilter }"> 

Come posso fare in modo che, se nulla è selezionata, mostra automaticamente tutti i paesi? E inizia a filtrare solo quando viene selezionato un particolare paese?

Sono sicuro che questo è probabilmente una domanda semplice ma sono abbastanza nuovo a questo e non poteva trovare come farlo.

Grazie!

Answer 1

Se l'espressione di filtro restituito undefined, allora il filtro non si applicherebbe . Quindi, si potrebbe fare qualcosa di simile al seguente:

<div ng-repeat="item in listings | filter:(!!locationFilter || undefined) && {location: locationFilter}"> 
    {{item}} 
</div> 

(!!locationFilter maniglie '', falsy e undefined valori)

plunker

Answer 2

Ecco il violino come ho raggiungere questo http://jsfiddle.net/L5wcgdhy/:-

HTML: -

<div ng-controller="MyCtrl"> 
<select ng-model="filter.categoryId"> 
     <option value="!!"></option> 
     <option ng-repeat="category in categories" value="{{category.id}}">{{category.id}}</option> 
    </select> 
    <table> 
     <thead> 
      <tr> 
       <th>Title</th> 
       <th>Category</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="record in records | filter:filter"> 
       <td>{{record.title}}</td> 
       <td>{{record.categoryId}}</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

Ctrl: -

function MyCtrl($scope) { 
    $scope.categories = [ 
     {id: 1}, 
     {id: 2}, 
     {id: 3} 
    ]; 

    $scope.filter = {categoryId: "!!"}; 

    $scope.records = [ 
     {title: "I'm in category #1!", categoryId: 1}, 
     {title: "Category 1 is for suckas. #2 ya'll!", categoryId: 2}, 
     {title: "Three is best", categoryId: 3} 
    ]; 
} 

Answer 3

vi consiglio di tenere una semplice dichiarazione dichiarativa nel vostro ng-repeat | filter

Quindi nel tag , aggiungere un campo per Tutti come:

<select ng-model="search.filter"> 
    <option value="{{undefined}}">All</option> 
    <option ng-repeat="field in locations" value="field">field</option> 
</select> 

Answer 4

I have tried this and it worked 
<select ng-options="model.FeatureVersion as model.FeatureVersion for model in PostDataResponse" ng-model="featureVersion"> 
    <option value="">All</option> 
    </select> 
    <table> 
    <tr ng-repeat="model in PostDataResponse | filter:{FeatureVersion: !!featureVersion?featureVersion: undefined }"> 
       <td>{{model.ClientId}}</td> 
    </tr> 
    </table>