隐藏ng-options中的选项 [英] hiding an option in ng-options

问题描述

我对Angular很新，并尝试了ng-options。在我的控制器中，我有：

I'm pretty new to Angular and trying the ng-options. In my controller, I have:

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

根据视图，我想要隐藏Read或Write。所以在我的控制器中，我有另一个标志，表明它是什么视图。在我使用ng-options之前，我有一个正常的选择下拉并做了类似的事情：

Depending on the view, I want to hide either Read or Write. So in my controller, I have another flag that indicates what view it is. Before I used ng-options, I had a normal select drop down and did something like this:

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

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

Is there a way to do this with ng-options? Thanks.

推荐答案

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

You could use a filter in the ngOptions expression:

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

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

and define the shouldShow() function to $scope in the controller:

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

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

For the full example see: http://plnkr.co/edit/8FkVktDXKGg3MQQawZCH

这篇关于隐藏ng-options中的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！