gpt4 book ai didi

javascript - 选中/取消选中复选框列表中的所有项目时的奇怪行为

转载 作者:行者123 更新时间:2023-11-30 18:00:30 28 4
gpt4 key购买 nike

在复选框列表中,应该可以通过按下按钮来选中/取消选中所有项目。但是下面的代码只能部分工作:

<div ng-controller="Controller">
<button ng-click="setCheckStateForAll(true)">All</button>
<button ng-click="setCheckStateForAll(false)">None</button>
<ul>
<li ng-repeat="item in items">
<input type="checkbox" id="{{item.name}}" ng-checked="item.isChecked"/>
<label for="{{item.name}}">{{item.name}}</label>
</li>
</ul>
</div>
function Controller($scope) {
$scope.items = [
{ name: "A", isChecked: true },
{ name: "B", isChecked: true },
{ name: "C", isChecked: true },
{ name: "D", isChecked: true },
{ name: "E", isChecked: true }
];

$scope.setCheckStateForAll = function(value) {
for (var i = 0; i < $scope.items.length; i++)
$scope.items[i].isChecked = value;
};
}

↗jsFiddle

默认情况下会选中所有项目,如果单击“无”,则会按预期取消选择所有项目。

但是如果选中“A”并再次单击“无”,“A”将保持选中状态(但不应该)。但是,如果单击“全部”,则会选中所有项目。

有什么问题吗?

最佳答案

而不是 ng-checked 使用 ng-model 绑定(bind)到 ìtem.isChecked。 ngModel 提供双向绑定(bind),而 ng-checked 不提供。

<input type="checkbox" id="{{item.name}}" ng-model="item.isChecked"/>

JSFIDDLE demo

关于javascript - 选中/取消选中复选框列表中的所有项目时的奇怪行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17109403/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com