각도 ui에 다중 필터를 추가해야합니다.

Question

angular uiselect2에 다중 필터를 추가해야합니다.

<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에서이 맞춤 필터를 추가하는 방법은 무엇입니까?

Answer 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 

}); 

뭔가를 시도 c를 드롭 다운에

난 단지 A, B를 얻을 수 갈까요, 난 필터링한다

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

보기 : 당신이 서있는 당신의 orderItem를 필터링해야하는 경우

<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

Answer 2

그런 다음 목록에서 제거하십시오.

당신은 3에서는이 있어야합니다

itemsInSelect

당신이 itemsInSelect에서 한 항목을 선택

ORDERITEMS

• allItems (모든 항목이 어딘가에 저장되어려면), 다음 추가 그것을 orderItems에 넣고 itemsInSelect에서 제거하십시오.

  원하는가요?