javascript - 在 AngularJS 中使用 ng-options 禁用选择框

Question

您好，如何禁用选择框，以便用户只能看到选择框的实际值，而无法更改其中的内容。它适用于 ionic 框架移动应用程序。

我的选择框看起来像这样:

<select ng-class="nightMode"
        ng-options="option as option.label for option in item.Options track by option.id"
        ng-change="item.Call(item.SettingKey,item.Checked.id)"
        ng-model="item.Checked">
</select>

我尝试使用 ng-disabled、在 ng-options 内禁用、ng-readonly，但这些都不适合我。那么实现这一目标的正确方法是什么？

ng-disable 示例:

<select ng-class="nightMode"
        ng-options="option as option.label for option in item.Options track by option.id"
        ng-disabled="true"
        ng-change="item.Call(item.SettingKey,item.Checked.id)"
        ng-model="item.Checked">
</select>

更新:我尝试了建议的解决方法之一:

<select ng-class="nightMode"
        ng-change="item.Call(item.SettingKey,item.Checked.id)"
        ng-model="item.Checked">
  <option ng-repeat="option in item.Options" value="option.id" ng-disabled="true" ng-selected="item.Checked.id==option.id">{{option.label}}</option>
</select>

但我可以切换到选择框中的空条目并将选择框的值设置为未定义。

Answer 1

您的代码片段尚不清楚。但我可以使用 disabled="true" 禁用此选择。

Check out my working
http://plnkr.co/edit/xDefIzZ3YleYcyAmQYHj?p=preview

Here are better code snippet editor :

http://plnkr.co/

http://jsfiddle.net/