Bind $ Index zu ng-Modell in eckig-ui-select

Question

Ich habe versucht, $index zu ng-model mit ui-select Direktive aber kein Glück zu binden.

<ui-select ng-model="selected.m"> 
    <ui-select-match> 
     <span ng-bind="$select.selected.name"></span> 
    </ui-select-match> 
    <ui-select-choices repeat="$index as choice in itemArray"> 
     <span ng-bind="choice + '' + $index"></span> 
    </ui-select-choices> 
    </ui-select> 

In obiger Vorlage itemArray ist ein Array von Monatsnamen und auf einem beliebigen Monat aus der Dropdown-Liste auswählen Ich mag seine $index an den ng-model binden (dh. ‚Selected.m‘).

Ich habe this Plunker bereit gemacht.

Answer 1

fand ich einen Weg, um diesen:

<ui-select ng-model="dummy" ng-change="selected.m=itemArray.indexOf(dummy)"> 
    <ui-select-match> 
     <span ng-bind="$select.selected.name"></span> 
    </ui-select-match> 
    <ui-select-choices repeat="choice in itemArray"> 
     <span ng-bind="choice + '/' + $index"></span> 
    </ui-select-choices> 
    </ui-select> 

Dies ist notwendig, weil $ Index des Ausdrucks oder innerhalb der Schleife in der Spur nur zur Verfügung steht. Außerdem ist AngularJS ein Framework, dass Sie Objekte manipulieren und nicht wie die alte Zeit indexieren wollen. Aus diesem Grund denke ich, dass ng-repeat/ng-options kein Design dafür ist.

Answer 2

Wenn alles, was Sie wollen, dass der $ Index ist, dann können Sie dies tun:

<ui-select-choices repeat="$index in itemArray"> 
    <span ng-bind="itemArray[$index] + '' + $index"></span> 
</ui-select-choices> 

Hier wird die zu dem $ Index select.selected $, das, was Ihr ng-Modell aktualisiert.

<pre> {{ selected }} </pre> 

<ui-select ng-model="selected.m"> 
    <ui-select-match> 
    <span>{{$select.selected}}</span> 
    </ui-select-match> 
    <ui-select-choices repeat="$index in itemArray"> 
    <span ng-bind="itemArray[$index] + '' + $index"></span> 
    </ui-select-choices> 
</ui-select> 

Answer 3

<ui-select ng-model="vm.mySelectedCountry" title="Choose a country" ng-required="true"> 
     <ui-select-match placeholder="">{{vm.countries[vm.mySelectedCountry].countryName}}</ui-select-match> 
     <ui-select-choices repeat="$index in vm.countries| filter: $select.search"> 
       <span ng-bind-html="vm.countries[$index].countryName | highlight: $select.search"></span> 
     </ui-select-choices> 
</ui-select>