AngularJS UI Wählen Starts Suche

Question

In meiner AngularJS app verwende ich UI select.This meine Html ist

<ui-select name="service" multiple ng-model="service.ServiceName" close-on-select="false" > 
       <ui-select-match placeholder="Select Services...">{{$item.ServiceName}}</ui-select-match> 
       <ui-select-choices repeat="service in Services | filter: {ServiceName: $select.search} | filter:myFilter track by service.ServiceId"> 
         {{service.ServiceName}} 
       </ui-select-choices> 

Select Filter bietet enthält suchen, aber ich möchte Elemente auf der Grundlage von StartsWith.I filtern haben gesehen, ein paar Beispiele für startswith Filter, aber ich kann sie nicht in UI Select integrieren.

Answer 1

Einzelartikel:Plunker.

JS

vm.startsWith = function (actual, expected) { 
    var lowerStr = (actual + "").toLowerCase(); 
    return lowerStr.indexOf(expected.toLowerCase()) === 0; 
    } 

Html

<ui-select-choices repeat="country in ctrl.countries|filter:$select.search:ctrl.startsWith"> 
     <span ng-bind-html="country.name | highlight: $select.search"></span> 
     <small ng-bind-html="country.code | highlight: $select.search"></small> 
    </ui-select-choices> 

Mehrere Artikel:Plunker

JS ist die gleiche wie oben.

Html

<ui-select multiple ng-model="ctrl.multipleDemo.colors" theme="bootstrap" ng-disabled="ctrl.disabled" close-on-select="false" style="width: 300px;" title="Choose a color"> 
    <ui-select-match placeholder="Select colors...">{{$item}}</ui-select-match> 
    <ui-select-choices repeat="color in ctrl.availableColors | filter:$select.search : ctrl.startsWith"> 
     {{color}} 
    </ui-select-choices> 
    </ui-select>