单击复选框时,角度视图不会更新

ran*_*shu 2 javascript angularjs

选中复选框时查看不更新.我应该使用$ scope.$ apply?我需要Current state在YES和NO之间切换,具体取决于是否选中了复选框.这是 JSbin 的代码

<!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>
Run Code Online (Sandbox Code Playgroud)


这是JS:

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'}
   ];

}]);
Run Code Online (Sandbox Code Playgroud)

Way*_*ery 11

你需要添加引号,因为它是一个angularjs表达式,它也需要是一个常量.如果YES用于角度表达式,通常angular会查找名为YES的范围变量,但这不会是常量角度表达式,因为YES的值可能会改变.

相反,您只想将值设置为"是",因为您希望将值指定为常量字符串"YES".如果您查看控制台,您会看到:Expected constant expression for 'ngTrueValue', but saw 'YES'.

<input type="checkbox"
           ng-model="sport.selected"
           ng-true-value="'YES'"
           ng-false-value="'NO'"/>
Run Code Online (Sandbox Code Playgroud)

http://plnkr.co/edit/ehXObXaXicC1BvKyQtmI?p=preview