如何让复选框绑定到数据模型中的布尔值？
我已经浏览了几个小时的类似问题，但没有找到任何与之完全匹配的问题。我想做的是让一个复选框通过数据绑定到我的数据中的true/false值自动选中。我可以毫不费力地获取要加载的项目名称，甚至可以稍后提取复选框值以保存到服务器上，但是我无法正确地获取初始值。
下面是一个简化的示例，它显示了基本问题: HTML：
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script src="shoppingListNg.js"></script>
<body ng-app>
<div ng-controller="ShoppingListCtrl">
<table>
<tr ng-repeat="item in shoppingList">
<td>
<div>{{item.text}}</div>
</td>
<td>
<input type="checkbox" ng-model="item.isGotten" />
</td>
</tr>
</table>
</div>
</body>这是Javascript：
function ShoppingListCtrl($scope) {
$scope.shoppingList = [
{
"text": "V8 fusion",
"isGotten": "true"
},
{
"text": "Whole milk container",
"isGotten": "false"
},
{
"text": "Protein bars",
"isGotten": "true"
}
];
};你知道为什么我不能让这些复选框尊重模型中的"true“和"false”值吗？每当页面加载时，它们总是显示为未选中。我是否需要使用ng-checked或其他指令？
回答 3
Stack Overflow用户
发布于 2013-04-28 02:22:58
问题是引号中有"true“和"false”，这使它们成为字符串，而不是Angular可以绑定复选框的布尔值。
如果您只需删除引号，如下所示，您的代码就可以正常工作。http://plnkr.co/edit/gkchmOBTkBtVv3TijlZW就是一个很好的例子。
function ShoppingListCtrl($scope) {
$scope.shoppingList = [
{
"text": "V8 fusion",
"isGotten": true
},
{
"text": "Whole milk container",
"isGotten": false
},
{
"text": "Protein bars",
"isGotten": true
}
];
};Stack Overflow用户
发布于 2014-05-21 04:04:57
根据您的数据，您可能不希望在代码中包含纯true/false。无论如何，AngularJS都会将true/false和1/0布尔值转换为字符串，因此您最好使用字符串。
在这段代码中，我使用"1“和"0”表示布尔值，使用ngTrueValue和ngFalseValue来告诉AngularJS如何保持绑定的完整性。非常简单和干净。
Codepen在这里：http://codepen.io/paulbhartzog/pen/kBhzn
代码片段：
<p ng-repeat="item in list1" class="item" id="{{item.id}}">
<strong>{{item.id}}</strong> <input name='obj1_data' type="checkbox" ng-model="list1[$index].data" ng-true-value="1" ng-false-value="0"> Click this to change data value below
</p>
<pre>{{list1 | json}}</pre>Stack Overflow用户
发布于 2015-04-07 18:56:34
如果我像这样添加额外的引号，我才能让ng-true-value工作(如官方Angular文档-https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D所示)。
ng-true-value="'1'"https://stackoverflow.com/questions/16255385
复制相似问题
腾讯云开发者
