隐藏ng-options中的选项

Cry*_*tal 13 javascript angularjs

我对Angular很新,并尝试了ng-options.在我的控制器中,我有:

$scope.permissionLevels = [
    { value: "ROLE_READ", text: "Read Only" },
    { value: "ROLE_WRITE", text: "Write" }
];
Run Code Online (Sandbox Code Playgroud)

在我的模板中,我有:

<select ng-options="permissionLevel.text for permissionLevel in permissionLevels"
        ng-model="selectedValue"></select>
Run Code Online (Sandbox Code Playgroud)

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

<select>
    <option>Read Only </option>
    <option ng-show="shouldShowWrite">Write </option>
</select>
Run Code Online (Sandbox Code Playgroud)

有没有办法用ng-options做到这一点?谢谢.

run*_*arm 30

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

<select ng-model="selectedValue"
        ng-options="permissionLevel.text for permissionLevel in 
                    permissionLevels | filter:shouldShow">
</select>
Run Code Online (Sandbox Code Playgroud)

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

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

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