Javascript 单击复选框时角度视图未更新
选中复选框时视图不更新。我应该使用$scope.$apply吗? 我需要根据复选框是否选中,在“是”和“否”之间更改当前状态。JSbin上的代码Javascript 单击复选框时角度视图未更新,javascript,angularjs,Javascript,Angularjs,选中复选框时视图不更新。我应该使用$scope.$apply吗? 我需要根据复选框是否选中,在“是”和“否”之间更改当前状态。JSbin上的代码 <!DOCTYPE html> <html ng-app="notesApp"> <head> <title>Notes App</title></head> <script src="https://cdnjs.cloudflare.com/ajax/l
<!DOCTYPE html>
<html ng-app="notesApp">
<head>
<title>Notes App</title></head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.8/angular.js"></script>
<body ng-controller="MainCtrl as ctrl">
<div>
<h2>What are your favorite sports?</h2>
<div ng-repeat="sport in ctrl.sports">
<br/>
<label ng-bind="sport.label"></label>
<div>
<input type="checkbox"
ng-model="sport.selected"
ng-true-value="YES"
ng-false-value="NO">
</div>
<div>
Current state: {{sport.selected}}
</div>
</div>
</div>
</body>
</html>
您需要添加引号,因为它是angularjs表达式,并且还需要是常量。如果对角度表达式使用YES,通常angular会查找名为YES的范围变量,但这不会是一个常量角度表达式,因为YES的值可能会更改 相反,您只需将该值设置为“Yes”,因为您希望将该值指定为常量字符串“Yes”。如果您在控制台中查看,您可能会看到:预期“ngTrueValue”的常量表达式,但会看到“YES”
您需要添加引号,因为它是angularjs表达式,并且还需要是常量。如果对角度表达式使用YES,通常angular会查找名为YES的范围变量,但这不会是一个常量角度表达式,因为YES的值可能会更改 相反,您只需将该值设置为“Yes”,因为您希望将该值指定为常量字符串“Yes”。如果您在控制台中查看,您可能会看到:预期“ngTrueValue”的常量表达式,但会看到“YES” 请参阅angularjs的错误参考文档。上面说 与ngModel结合使用的某些属性(如ngTrueValue或ngFalseValue)将只接受常量表达式 请参阅angularjs的错误参考文档。上面说 与ngModel结合使用的某些属性(如ngTrueValue或ngFalseValue)将只接受常量表达式
谢谢你知道我为什么需要添加额外的单引号吗?@Wayne Ellery正确答案的简短解释:你是在用字符串操作,而不是用作用域对象,而不是用YES上的单引号,您必须使用两次“是”来正确确定绑定识别的范围。是否可以将其添加为$apply或$watch而不是两次报价?这是怎么回事?你可以,但是用引号来表示“是”、“否”有什么问题呢?这意味着将sport.selected的值设置为“是”或“否”,这就是您想要的。为什么要使用$apply或$watch?这似乎是一个非常复杂的解决问题的方法。谢谢。你知道我为什么需要添加额外的单引号吗?@Wayne Ellery正确答案的简短解释:你是在用字符串操作,而不是用作用域对象,而不是用YES上的单引号,您必须使用两次“是”来正确确定绑定识别的范围。是否可以将其添加为$apply或$watch而不是两次报价?这是怎么回事?你可以,但是用引号来表示“是”、“否”有什么问题呢?这意味着将sport.selected的值设置为“是”或“否”,这就是您想要的。为什么要使用$apply或$watch?这似乎是解决问题的一种非常复杂的方法。
angular.module('notesApp', [])
.controller('MainCtrl', [function() {
var self = this;
self.sports = [
{label: 'Basketball', selected: 'YES'},
{label: 'Cricket', selected: 'NO'},
{label: 'Soccer', selected: 'NO'},
{label: 'Swimming', selected: 'YES'}
];
}]);
<input type="checkbox"
ng-model="sport.selected"
ng-true-value="'YES'"
ng-false-value="'NO'"/>