在ng-options中隐藏选项

Question

我是Angular的新手，正在尝试ng-options。在我的控制器中，我有：

$scope.permissionLevels = [
    { value: "ROLE_READ", text: "Read Only" },
    { value: "ROLE_WRITE", text: "Write" }
];

在我的模板中，我有：

<select ng-options="permissionLevel.text for permissionLevel in permissionLevels"
        ng-model="selectedValue"></select>

根据视图的不同，我想隐藏读或写。因此，在我的控制器中，我有另一个标志来指示它是什么视图。在我使用ng-options之前，我有一个普通的select下拉列表，并执行了如下操作：

<select>
    <option>Read Only </option>
    <option ng-show="shouldShowWrite">Write </option>
</select>

有没有办法用ng-options做到这一点呢？谢谢。

Answer 1

您可以在ngOptions表达式中使用过滤器：

<select ng-model="selectedValue"
        ng-options="permissionLevel.text for permissionLevel in 
                    permissionLevels | filter:shouldShow">
</select>

并将shouldShow()函数定义为控制器中的$scope：

$scope.shouldShow = function (permissionLevel) {
  // put your authorization logic here
  return $scope.permission.canWrite || permissionLevel.value !== 'ROLE_WRITE';
}

有关完整示例，请参阅：http://plnkr.co/edit/8FkVktDXKGg3MQQawZCH

Answer 2

考虑将ngRepeat用于该级别的控制。我认为使用ngOptions是不可能的。

 <select ng-model="selectedValue">
    <option ng-repeat="permissionLevel in permissionLevels" value="{{permissionLevel.text}}" ng-show="shouldShowWrite(permissionLevel)">
      {{permissionLevel.text}}
    </option>
  </select>

Answer 3

请检查以下代码，它可能会帮助您解决此问题！！

<select>
<option>Read Only </option>
<option ng-show="selectedValue.value=='ROLE_WRITE'">Write </option>
</select>