Filter ui-Auswahl Dropdown auf Geschwister basiert ui-Wert auswählen

Question

Ich habe ein Formular mit mehreren Zeilen, die in einem modalen Dialog wiederholt werden. Jede Zeile hat zwei Dropdown-Listen <ui-select>.

Das erste Dropdown-Menü bietet Auswahlmöglichkeiten für einen bestimmten Typ und das zweite Dropdown-Feld enthält Untertypen der Typen im ersten Dropdown-Menü. Abhängig davon, was im ersten Dropdown ausgewählt wird, möchte ich die Werte in der Sekunde filtern, um nur jene anzuzeigen, die eine ParentId haben, die dem Id des ausgewählten Typs im ersten Dropdown entspricht.

Das ist mein Markup

<tr ng-repeat="item in vm.responseItems"> 
    <td> 
     <div class="form-group" show-errors> 
      <ui-select name="ResponseType" ng-model="item.Type" required> 
       <ui-select-match>{{$select.selected.Name | ngoLocalize}}</ui-select-match> 
       <ui-select-choices repeat="type in responseTypes | orderBy:'Name' | filter: $select.search"> 
        <span ng-bind-html="type.Name | ngoLocalize | highlight: $select.search"></span> 
       </ui-select-choices> 
      </ui-select> 
     </div> 
    </td> 
    <td> 
     <div class="form-group" show-errors ng-if="responseInfoSubtypes.length"> 
      <ui-select name="RseponseSubtype" ng-model="item.ResponseSubtype"> 
       <ui-select-match>{{$select.selected.Name | ngoLocalize}}</ui-select-match> 
       <ui-select-choices repeat="type in (responseSubtypes | orderBy:'Name' | filter: $select.search | filter: subTypeFilter)"> 
        <span ng-bind-html="type.Name | ngoLocalize | highlight: $select.search"></span> 
       </ui-select-choices> 
      </ui-select> 
     </div> 
    </td> 
</tr> 

Ich möchte einen einfachen Filter schreiben, die so etwas wie unten aussieht, aber ich weiß nicht, wie ich den Wert des ersten Drop-Down aus dem Inneren des Filters zugreifen können.

$scope.subTypeFilter = function (subType) { 
    return subType.ParentId === ???.Id; 
} 

Ich habe versucht, es umzukehren und zu dem Filter des ersten Drop-Down-Wert als Argument senden und dann wie unten vergleichen, aber es funktioniert nicht so, wie ich die Absicht, es zu.

//'responseType' is the value from the first dropdown 
//'index' is the current index of the subTypes being filtered 
//'val' is the array of the subTypes being filtered 
$scope.subTypeFilter = function (responseInfoType, index, val) { 
    return val[index].ParentId !== responseInfoType.Id; 
} 

Das scheint eine ziemlich einfache Sache in der Theorie, aber ich kann meinen Kopf nicht darum wickeln. Wie kann dies erreicht werden?

Answer 1

in html

filter: subTypeFilter : item.Type 

in js

app.filter('subTypeFilter', function() { 
    return function(array, itemType) { 
    //... 
    } 
})