2017-07-18 2 views
1

wenn ich ein select-Element wie folgt aus:Wie vermeidet man doppelte Zeichenkette in einer Auswahl?

<select 
     ng-model="dispatchOutput" 
     ng-options="item as (item.output | uppercase) for item in searchFilterDispatcher.params" 
     class="form-control" 
     id="dispatchOutput" > 

, die die ausgewählten Elemente aus einer Liste von Objekt füllen, die die Möglichkeit haben, mehrere Strins mit den gleichen Werten zu haben, wie kann ich doppelte Einträge zeigen vermeiden ?

+3

Mögliches Duplikat von [Wie ng-repeat ausfiltern doppelte Ergebnisse machen] (https://stackoverflow.com/questions/15914658/how- make-ng-repeat-filter-out-duplicate-Ergebnisse –

Antwort

1

Verwendung einzigartige Filter Unique-filter

angular.module("app",['angular.filter']) 
 
    .controller("ctrl",['$scope',function($scope){ 
 
    $scope.searchFilterDispatcher={}; 
 
    $scope.searchFilterDispatcher.params = [ 
 
     {output:'abc', value:1}, 
 
     {output:'abc', value:1}, 
 
     {output:'xyz', value:2} 
 
    ]  
 
    
 
    }])
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.js"></script> 
 
<html> 
 
<body ng-app="app" ng-controller="ctrl"> 
 
    <select 
 
    ng-model="dispatchOutput" 
 
    ng-options="item as (item.output | uppercase) for item in searchFilterDispatcher.params | unique : 'output'" 
 
    class="form-control" 
 
    id="dispatchOutput" > 
 
</select> 
 
</body> 
 
<html>

1

Sie sollten einen benutzerdefinierten Filter erstellen, um die eindeutige Werte herauszufiltern und dann Anwendung, wenn zu ng-Optionen:

app.filter('unique', function() { 
    return function (arr, field) { 
     return _.uniq(arr, function(a) { return a[field]; }); // (Assuming that you are using lodash in your app) if not use you custom logic here 
    }; 
}); 

Später in der Vorlage Sie diesen Filter verwenden könnte.

Aber ich würde Sie https://github.com/a8m/angular-filter#unique

Dies hat viele Filter bereits verfügbar für den Einsatz verwenden vorschlagen und Ihren oben genannten Zweck dienen kann.

Verwandte Themen