0

Sie müssen mehrere Filter hinzufügen in angular uiselect2.Sie müssen mehrere Filter in eckigen Winkel hinzufügen. Wählen Sie

<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> 

Ich habe

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

Und ich brauche es zu filtern, indem filter: $select.search auch durch OrderItem. Wie füge ich diesen benutzerdefinierten Filter in ui-select hinzu?

IN Dropdown shoud ich nur a, b, sollte ich filtern c

Antwort

1

etwas versuchen, wie die

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 

}); 

Ihrer Ansicht

<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

ein Element ausschließen ein Filter

-Controller verwenden:

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

Ausblick:

<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 für die Antwort ... aber ich muss Filter hinzufügen .. ich sollte nicht c in meinem droupdown bekommen. ,, das ist meine Frage. @MMK – mammam

+0

können Sie mir helfen! @MMK – mammam

+0

benutzerdefinierte Filter ist erforderlich, um das Objekt auszuschließen, die Sie nicht benötigen. – MMK

0

Wenn Sie Ihr orderItem fro filtern müssen M die Liste, dann entfernen Sie sie zu dieser Liste.

Sie sollten 3-Listen haben:

  • AllItems (Um alle Elemente irgendwo gespeichert haben)
  • Order
  • itemsInSelect

Wenn Sie ein Element aus der itemsInSelect wählen, dann fügen es zu den orderItems und entfernen Sie es von den itemsInSelect.

Wollen Sie das?

+0

ja .. dieser eine Weg richtig !!!! @Horth – mammam

+0

Irgendwann nehme das Problem auf andere Weise ist die Lösung;) – Hornth