如何以编程方式取消选中复选框？答案

【问题标题】：How to programmatically uncheck checkbox?如何以编程方式取消选中复选框？
【发布时间】：2023-03-30 16:40:02
【问题描述】：

我想以编程方式取消选中一个复选框。我知道如何在 javascript 中使用它，但由于我使用的是 angular，我认为它是不同的。

这是我第一次使用 jsfiddle，如果您看不到脚本和 html，请告诉我。

这是html

<input type="checkbox" ng-model="v" ng-click="checkAll()" />
<button ng-click="x()">eto</button>

这是角度

$scope.x = function () {
    $scope.v.checked=false;
};

我知道有很多这样的问题，我已经尝试过了，但我无法让它发挥作用。

谢谢！

【问题讨论】：

【解决方案1】：

<input type="checkbox" ng-checked="v" ng-click="checkAll()" />

在你的控制器中

$scope.v = true; // or false

【讨论】：

【解决方案2】：

第一件事：您已经在 ul 上指定了控制器并绑定了 ul 外按钮的单击事件，因此将 ng-controller 移动到了 div 上。

第二件事：为了实用地检查它，您需要设置$scope.Items[i].Selected = true;

$scope.x = function () {
    alert("x");
    $scope.Items[0].Selected=true;
};

为什么我们需要设置 Items[i] 的 Selected 属性，而我还没有声明？

这背后的原因是你的 html 绑定是这样的：

<li ng-repeat="item in Items">
    <label>{{item.Name}}
        <input type="checkbox" ng-model="item.Selected" />
    </label>
</li>

这里的每个项目都是 Items 数组中的元素，这意味着您的复选框选中值现在绑定到该对象的选定属性。即使您尚未在 Items 集合中定义该属性，角度也会创建它并将其绑定到该属性。因此，您需要设置该属性。希望对你有帮助。

这是工作小提琴 => link

【讨论】：