使用 ng-options 在 select 下拉列表中的对象数组上显示 ng-show

Question

我正在使用 ng-options 遍历我的对象数组并将正确的状态列表显示到视图，并将我需要的内容绑定到模型。

此视图在任何给定时间都可以处于两种状态，一种是空的 workOrder 或已经具有值的 workOrder。

现在我想在工作订单返回 'A' 或 'Active' 状态的情况下，'Closed' 和 'Processing' 状态不会在下拉列表中显示。

我想为此使用 ng-show，但也想知道是否有更合适的方法来解决这个问题。

我的对象：

workOrder.statuses = [
        {
            'Status': 'Open',
            'Code': 'O',
            'Show': true
        },
        {
            'Status': 'Active',
            'Code': 'A',
            'Show': true
        },
        {
            'Status': 'Processing',
            'Code': 'P',
            'Show': true
        },
        {
            'Status': 'Closed',
            'Code': 'C',
            'Show': true
        }
    ];

我正在使用的HTML：

<select title="Status" class="form-control" id="ddlStatus"
                    ng-options="status.Code as status.Status for status in ctrl.statuses"
                    ng-model="ctrl.model.Status">
</select>

我运行遇到了一些问题，试图让它发挥作用，但似乎没有任何效果，通过 Whosebug 搜索我无法找到可靠的答案。

非常感谢任何帮助！

Answer 1

首先，您可以像这样过滤您的选项数组：

<li ng-repeat="status.Code as status.Status for status in ctrl.statuses | filter : {Status: 'Open'}: true">

其次，您可以使用这样的选项填充 select

<select name="repeatSelect" id="repeatSelect" ng-model="data.repeatSelect">
  <option ng-repeat="option in data.availableOptions" value="{{option.id}}">{{option.name}}</option>
</select>

因此您可以在此处指定 'ng-if' 以隐藏您不想显示状态的选项

更新：

所以你可以使用过滤器：

<option ng-repeat="status in ctrl.statuses | filter : {Status: '!' + ctrl.model.Status}: true" value='{{status.Code}}'>{{status.Status}}</option>

或者如果你不想使用 ng-repeat，你可以在 selected 状态改变时过滤作用域中的选项数组。

使用 ng-options 在 select 下拉列表中的对象数组上显示 ng-show

ng-show on array of objects on select dropdown with ng-options

javascript

angularjs

ng-options

ng-show