2017-03-13 7 views
0

角度1.6を使用すると、ページの読み込み時にチェックボックスがオンになりますが、チェックボックスをクリックするとチェックボックスモデルは更新されません。どうして?チェックするとAngularJSチェックボックスモデルが更新されません

コード:あなたは、チェックボックスを外しますとき

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

あなたはおそらく、あなたが達成したいものに、より詳細を与えることができます。 – onmyway

+0

あなたの質問はscenceを作っていません –

答えて

0

あなたは、チェックボックスがチェックされますので、デフォルトでは、あなたがコントローラ

var data = { 
    C_DJB:{VAL:'1'} 
} 

で定義されてきたように

ng-checked="obj.C_DJB.VAL=='1'" 

を削除する必要があります。 チェックボックスをオンまたはオフにすると、それに応じて値が更新されます。 問題は、ng-checked = "obj.C_DJB.VAL == '1'"と指定した場合、Checboxの値はチェックボックスにチェックを入れるかチェックを外しても常に1のままです。

+0

ありがとう!!!!!! –

1

印刷されている値は、モデルがうまく更新取得されることを意味し、1から0に変化しています。

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>

0

var app = angular.module("demo",[]); 
 
    app.controller("ctrl",["$scope",function($scope){ 
 
    var data = { 
 
     C_DJB:{VAL:'0'} 
 
    } 
 
     $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"" /> <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>

関連する問題