verknüpfte Angular-Ui-Select

Question

Ich versuche, gruppierte Ui-Select, in der Tat jede Ui-Auswahl-Option hängt von der vorherigen. zum Beispiel habe ich eine Liste von Ebenen in der ersten UI-Auswahl, und dann abhängig von der ersten ui-select selected Item eine Liste der Ortsnummer wird auf der zweiten Ui-Auswahl angezeigt werden. ist das möglich? hier ist mein Code, aber ich war noch nicht der Lage, es

<div class="SumoSelect sumo_somename" tabindex="0" style="width:80%"> 
     <ui-select search-enabled=false ng-model="levelNumber.selected" 
         theme="bootstrap" append-to-body="true" on-select="getListPlacePerLevel(levelNumber.selected)"> 
        <ui-select-match placeholder="">{{$select.selected.levelNumber}}</ui-select-match> 
        <ui-select-choices repeat="item in levels"> 
        <span ng-bind="item.levelNumber"></span> </ui-select-choices> </ui-select> 
    </div> 
    <div class="SumoSelect sumo_somename" tabindex="0" style="width:80%; margin-top:20px;"> 
     <ui-select search-enabled=false ng-model="item.selected" 
         theme="bootstrap" append-to-body="true"> 
        <ui-select-match placeholder="">{{$select.selected.item}}</ui-select-match> 
        <ui-select-choices repeat="item in levelNumber.selected.listPlaceNumber"> 
        <span ng-bind="item"></span> </ui-select-choices> </ui-select> 
    </div> 

und meine Json Daten implemnt :(wie unten

[{"levelNumber":1,"listPlaceNumber":[1,2,3,4,6]},{"levelNumber":2,"listPlaceNumber":[2,4,6,7]},{"levelNumber":3,"listPlaceNumber":[11,12,13,14,16]}] 

Answer 1

Sehen Sie, wenn diese zupfen für Sie arbeitet:

http://plnkr.co/edit/2kiQ7W?p=preview

Relevante Code:

<div tabindex="0" style="width:80%"> 
    <ui-select search-enabled="false" ng-model="levelNumber.selected" theme="bootstrap" append-to-body="true" on-select="getListPlacePerLevel(levelNumber.selected)"> 
     <ui-select-match placeholder="">{{$select.selected.levelNumber}}</ui-select-match> 
     <ui-select-choices repeat="item in levels"> 
      <span ng-bind="item.levelNumber"></span> 
     </ui-select-choices> 
    </ui-select> 
</div> 
<div tabindex="0" style="width:80%; margin-top:20px;"> 
    <ui-select search-enabled="false" ng-model="item.selected" theme="bootstrap" append-to-body="true" on-select="getListPlacePerLevel($select.selected)"> 
     <ui-select-match placeholder="">{{$select.selected}}</ui-select-match> 
     <ui-select-choices repeat="item in levelNumber.selected.listPlaceNumber"> 
      <span ng-bind="item"></span> 
     </ui-select-choices> 
    </ui-select> 
</div>