0

Необходимо добавить несколько фильтров в angular uiselect2.Нужно добавить несколько фильтров в угловой ui select

<div class="form-group "> 
    <ui-select id="abc" ng-model="abc" multiple theme="bootstrap" > 
     <ui-select-match placeholder="Select abc..." class="ui-select-match">{{$item.name | capitalize}}</ui-select-match> 
     <ui-select-choices id= "abchoice" class="ui-select-choices" repeat="item in itemDetails| filter: $select.search "> 
       <div id="selected_{{item}}" ng-bind-html="item .name | capitalize | highlight: $select.search" style="padding: 0px; "></div> 
     </ui-select-choices> 
    </ui-select> 

</div> 

У меня есть

itemDetails=["a","b","c"] 
orderItem=["c"] 

И мне нужно, чтобы отфильтровать его filter: $select.search также по OrderItem. Как добавить этот настраиваемый фильтр в ui-select?

В раскрывающемся меню я Шоуда получить только, б, я должен фильтровать с

ответ

1

Попробуйте что-то вроде этого

var app = angular.module('demo', ['ui.select']); 
app.controller('DemoCtrl', function($scope) { 

    $scope.itemDetails = ['a','b','c']; 
    $scope.orderItem = {}; 
    $scope.orderItem.items = ['a','b']; // by default selected items 

}); 

На ваш взгляд

<ui-select multiple ng-model="orderItem.items" theme="select2" ng-disabled="disabled" style="width: 300px;"> 
    <ui-select-match placeholder="Select order item...">{{$item}}</ui-select-match> 
    <ui-select-choices repeat="item in itemDetails | filter:$select.search"> 
     {{item}} 
    </ui-select-choices> 
</ui-select> 
    <p>Selected: {{orderItem.items}}</p> 

Plunker 1

исключить позицию, используя фильтр

Контроллер:

'use strict'; 
    var app = angular.module('demo', ['ui.select']); 
    app.controller('DemoCtrl', function($scope) { 
     $scope.itemDetails = ['a','b','c']; 
     $scope.orderItem = {}; 
     $scope.orderItem.items = null; 
    }); 
    // filter to exclude a value/item 
    app.filter('Exclude', function() { 
     return function(items) { 
     var filtered = []; 
     angular.forEach(items, function(item) { 
      if(item!='c'){ 
      filtered.push(item); 
      } 
     }); 
     return filtered; 
     };   
}); 

Вид:

<p>Selected: {{orderItem.items}}</p> 
    <ui-select ng-model="orderItem.items" theme="select2" ng-disabled="disabled" style="width: 300px;"> 
    <ui-select-match placeholder="Select order item...">{{$select.selected}}</ui-select-match> 
    <ui-select-choices repeat="item in itemDetails | Exclude | filter:$select.search"> 
     {{item}} 
    </ui-select-choices> 
    </ui-select> 

Plunker 2

+0

thnaks для ответа ... но мне нужно добавить фильтр .. я не должен получать c в моем droupdown. ,, thats мой вопрос. @MMK – mammam

+0

может помочь мне! @MMK – mammam

+0

Пользовательский фильтр необходим, чтобы исключить объект, который вам не нужен. – MMK

0

Если вам нужно фильтровать orderItem сюда в списке, затем удалите их в этот список.

Вы должны иметь 3 списка:

  • allItems (иметь все элементы хранятся где-то)
  • ТоварыЗаказа
  • itemsInSelect

При выборе одного элемента из itemsInSelect, затем добавить он в orderItems и удалить его из itemsInSelect.

Это вы хотите?

+0

да .. этот один way правильный !!!! @Hornth – mammam

+0

Когда-нибудь, возьмите проблему по-другому - это решение;) – Hornth