2016-11-10 116 views
1

這裏是我的角度UI選擇HTML:如何從角度ui選擇刪除重複的選項?

<ui-select title="Select Template Directory" ng-change="searchTemplate()" theme="select2" ng-model="search_data.sub_directory" id="search_sub_directory" name="search_sub_directory" class="search_panel"> 
    <ui-select-match allow-clear="true" placeholder="Select Template Directory">{{$select.selected.subDirectory}}</ui-select-match> 
    <ui-select-choices repeat="template.subDirectory as template in response_template_directories | filter: $select.search"> 
     <span ng-bind-html="template.subDirectory | highlight: $select.search"></span> 
    </ui-select-choices> 
</ui-select> 

,這裏是response_template_directories

[ 
{subDirectory : 1}, 
{subDirectory : 1}, 
{subDirectory : 1}, 
{subDirectory : 1}, 
{subDirectory : 1}, 
{subDirectory : 1}, 
{subDirectory : 2}, 
{subDirectory : 3}, 
] 

選擇列表也顯示出重複

enter image description here

我怎樣才能在用戶界面中刪除這些重複選擇html?

+0

可以實現自定義過濾器或控制器 – Naigel

+0

是的,我可以過濾'response_template_directories'數組,但我想做的事這在html –

+1

可能的重複 - http://stackoverflow.com/questions/15914658/how-to-make-ng-repeat-filter-out-duplicate-results –

回答

2

使用過濾器唯一(從AngularUI執行或導入a8m/angular-filter)。

<ui-select title="Select Template Directory" ng-change="searchTemplate()" theme="select2" ng-model="search_data.sub_directory" id="search_sub_directory" name="search_sub_directory" class="search_panel"> 
<ui-select-match allow-clear="true" placeholder="Select Template Directory">{{$select.selected.subDirectory}}</ui-select-match> 
<ui-select-choices repeat="template.subDirectory as template in response_template_directories | unique: 'subDirectory' | filter: $select.search"> 
    <span ng-bind-html="template.subDirectory | highlight: $select.search"></span> 
</ui-select-choices> 

或寫lodash自己的過濾器:

app.filter('unique', function() { 
    return function (arr, field) { 
     return _.uniq(arr, function(a) { return a[field]; }); 
    }; 
}); 
+0

它給錯誤:https://docs.angularjs.org/error/$injector/unpr?p0=uniqueFilterProvider%20%3C-%20uniqueFilter –

+0

你必須實現這個過濾器(https:// github .com/angular-ui/angular-ui/blob/master/modules/filters/unique/unique.js),或者用lodash做到這一點。 – Matheus

+0

太好了。 thankx。它解決了我的問題 –