Question

我有一个多行的表单，在模式对话框中重复。每行有两个<ui-select>下拉列表。

第一个下拉列表包含特定类型的选项，第二个下拉列表包含第一个下拉列表中类型的子类型。根据第一个下拉列表中选择的内容，我想过滤第二个下拉列表中的值，以便仅显示第一个下拉列表中ParentId等于所选类型的Id的人。

这是我的标记

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

我想编写一个类似于下面的简单过滤器，但我不知道如何从过滤器内部访问第一个下拉列表的值。

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

我试图将其反转，并将第一个下拉值作为参数发送到过滤器，然后像下面那样进行比较，但它不会像我想要的那样工作。

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

理论上这似乎是一件非常简单的事情，但我无法绕过它。如何实现这一目标？

Answer 1

in html

filter: subTypeFilter : item.Type

在js

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

根据兄弟ui-select值过滤ui-select下拉列表

1 个答案: