如何避免选择中的重复字符串?

问题描述:

如果我有这样的选择元素:如何避免选择中的重复字符串?

​​

填充所选择从有到具有相同值的多个Strins可能对象的列表元素,如何避免显示重复的条目?

+3

的可能的复制[如何使NG重复过滤掉重复的结果(https://*.com/questions/15914658/how-对做-NG-重复过滤出重复的-结果) –

使用独特的过滤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>

您应该创建一个自定义过滤器来过滤出独特的价值和应用,为NG选项:

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 
    }; 
}); 

在你的模板之后,你可以使用此过滤器。

但我会建议你使用https://github.com/a8m/angular-filter#unique

这有很多已经可以使用过滤器,可以为你的上述目的。