ng-readonly不在角度复选框中工作

Can I use ng-readonly directive in a checkbox?

我可以在复选框中使用ng-readonly指令吗？

The checkbox is writable even after it is decorated with ng-readonly.

即使用ng-readonly修饰后，该复选框也是可写的。

Html:

HTML：

<input type="checkbox" ng-model="model" ng-readonly="test" /> {{model}}

Controller:

控制器：

myApp.controller('MyCtrl', function($scope) {
    $scope.test = true;
});

Added Fiddle

添加小提琴

3 个解决方案

#1

if you want to disable it use this:

如果你想禁用它，请使用：

<input type="checkbox" ng-disabled="true" ng-model="test" />

#2

If you like to have it "more" visible, you can always use a little javascript trick:

如果你想让它“更”可见，你可以随时使用一些小技巧：

<input type="checkbox" ng-model="model" onclick="return false;" />

#3

ng-readonly only work with input type="text"

ng-readonly仅适用于输入类型=“文本”

see documentation here -https://docs.angularjs.org/api/ng/directive/ngReadonly

请参阅此处的文档-https：//docs.angularjs.org/api/ng/directive/ngReadonly

The HTML specification does not require browsers to preserve the values of boolean attributes such as readonly. (Their presence means true and their absence means false.) If we put an Angular interpolation expression into such an attribute then the binding information would be lost when the browser removes the attribute. The ngReadonly directive solves this problem for the readonly attribute. This complementary directive is not removed by the browser and so provides a permanent reliable place to store the binding information.

HTML规范不要求浏览器保留布尔属性的值，例如readonly。（它们的存在意味着真实，它们的缺失意味着错误。）如果我们将Angular插值表达式放入这样的属性中，那么当浏览器删除属性时绑定信息将会丢失。 ngReadonly指令解决了readonly属性的这个问题。浏览器不会删除此补充指令，因此提供了存储绑定信息的永久可靠位置。

#1