当我使用Angular 1.6时,会在页面加载时选中一个复选框,但是当我单击该复选框时,复选框模型不会更新。为什么呢?
代码:
var app = angular.module("demo",[]);
app.controller("ctrl",["$scope",function($scope){
var data = {
C_DJB:{VAL:'1'}
}
$scope.obj = data;
}])
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="test">
<meta name="author" content="">
<title>Page Title</title>
</head>
<body ng-app="demo" ng-controller="ctrl">
<h1>Body</h1>
<input type="checkbox" ng-model="obj.C_DJB.VAL" ng-true-value="1" ng-false-value="0" ng-checked="obj.C_DJB.VAL=='1'" /> <br/>
<input type="checkbox" ng-model="obj.C_DJB.VAL" ng-true-value="1" ng-false-value="0" ng-checked="obj.C_DJB.VAL=='1'" /> <br/>
{{obj.C_DJB.VAL}}
</body>
</html>
答案 0 :(得分:1)
当您取消勾选复选框时,正在打印的值从1更改为0,这意味着模型正在更新。
答案 1 :(得分:0)
您需要删除
ng-checked="obj.C_DJB.VAL=='1'"
正如您在控制器中定义的那样
var data = {
C_DJB:{VAL:'1'}
}
所以默认情况下会选中复选框。 现在,当您选中或取消选中该复选框时,该值将相应更新。 问题是,当您给出ng-checked =“obj.C_DJB.VAL =='1'”时,无论您勾选还是取消勾选复选框,checbox值始终为1。
答案 2 :(得分:0)
var app = angular.module("demo",[]);
app.controller("ctrl",["$scope",function($scope){
var data = {
C_DJB:{VAL:'1'}
}
$scope.obj = data;
}])
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="test">
<meta name="author" content="">
<title>Page Title</title>
</head>
<body ng-app="demo" ng-controller="ctrl">
<h1>Body</h1>
<input type="checkbox" ng-model="obj.C_DJB.VAL" ng-true-value="1" ng-false-value="0" ng-checked="obj.C_DJB.VAL=='1'" /> <br/>
<input type="checkbox" ng-model="obj.C_DJB.VAL" ng-true-value="1" ng-false-value="0" ng-checked="obj.C_DJB.VAL=='1'" /> <br/>
{{obj.C_DJB.VAL}}
</body>
</html>
答案 3 :(得分:0)
var app = angular.module("demo",[]);
app.controller("ctrl",["$scope",function($scope){
var data = {
C_DJB:{VAL:'0'}
}
$scope.obj = data;
}])
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="test">
<meta name="author" content="">
<title>Page Title</title>
</head>
<body ng-app="demo" ng-controller="ctrl">
<h1>Body</h1>
<input type="checkbox" ng-model="obj.C_DJB.VAL" ng-true-value="1" ng-false-value="0"" /> <br/>
<input type="checkbox" ng-model="obj.C_DJB.VAL" ng-true-value="1" ng-false-value="0"" /> <br/>
{{obj.C_DJB.VAL}}
</body>
</html>
&#13;