Angular JS中的条件下拉值

Question

我的UI中有两个下拉列表，如组类型和子组类型。

    <div class="form-group row">
        <label for="GroupType" class="col-sm-4 form-control-label">Group Type: </label>
        <div class="col-sm-8">
            <select name="selGroupType" id="selGroupType" class="form-control" ng-change="referenceAddRecord.populateGroupTypeDetails(selGroupType)" ng-options="groupType.value for groupType in referenceAddRecord.groupTypes track by groupCode.id" ng-model="referenceAddRecord.groupType"></select>
        </div>
    </div>
    <div class="form-group row">
        <label for="SubGroupType" class="col-sm-4 form-control-label">Sub Group Type: </label>
        <div class="col-sm-8">
            <select name="selSubGroupType" id="selSubGroupType" class="form-control" ng-change="referenceAddRecord.populateSubGroupTypeDetails(selSubGroupType)" ng-options="subGroupType.value for subGroupType in referenceAddRecord.subGroupTypes track by subGroupType.id" ng-model="referenceAddRecord.subGroupType"></select>
        </div>
    </div>

在我的控制器中，我在读取JSON文件后绑定值，如

referenceDataDropDownService.getDropDown(REFERENCE_DATA_CONSTANTS.GROUP_TYPE).success(function (result) {
    $scope.referenceAddRecord.groupTypes = result;
}).error(function (result) {
    alert("Unable to retrieve dropdown values");
});

referenceDataDropDownService.getDropDown(REFERENCE_DATA_CONSTANTS.SUB_GROUP_TYPE).success(function (result) {

    $scope.referenceAddRecord.subGroupTypes = result;
}).error(function (result) {
    alert("Unable to retrieve dropdown values");
});

现在我希望Sun Group Types值依赖于下拉列表中选定的Group Type值。

因此，例如，对于Sub Group Types第二个下拉列表，结果是一组对象，如：

对于Group Types下拉列表，结果如下：

现在，只有当选择了“组类型”下拉列表中的“章节事件”时，那么对于该ID，我想从子组类型下拉列表中选择值，其中值为id（5）连接。

喜欢'拍卖'应显示为值'拍卖| 5'。同样，应显示值。

我该怎么做？

此外，默认情况下，在加载时，无论选择哪种组类型，都应相应地填充子组类型。

请帮忙。

Answer 1

如果我理解了您的问题，那么您正尝试根据另一个选项中的选项过滤一个选项的选项。为此，您只需在第二个选择的ng-options指令中添加一个过滤器。像这样：

ng-options="subGroupType.value for subGroupType in referenceAddRecord.subGroupTypes | filter: {id: referenceAddRecord.groupType.id} track by subGroupType.id"

这是一个有效的plunk