[解決済み] ng-clickでチェックボックスをクリックしてもモデルが更新されない
2023-05-23 23:05:47
質問
チェックボックスをクリックして ng-click を呼び出すと、ng-click が起動する前にモデルが更新されないので、チェックボックスの値が UI で誤って表示されます。
これはAngularJS 1.0.7で動作し、Angualar 1.2-RCxで壊れているようです。
<div ng-app="myApp" ng-controller="Ctrl">
<li ng-repeat="todo in todos">
<input type='checkbox' ng-click='onCompleteTodo(todo)' ng-model="todo.done">
{{todo.text}}
</li>
<hr>
task: {{todoText}}
<hr><h2>Wrong value</h2>
done: {{doneAfterClick}}
とコントローラになります。
angular.module('myApp', [])
.controller('Ctrl', ['$scope', function($scope) {
$scope.todos=[
{'text': "get milk",
'done': true
},
{'text': "get milk2",
'done': false
}
];
$scope.onCompleteTodo = function(todo) {
console.log("onCompleteTodo -done: " + todo.done + " : " + todo.text);
$scope.doneAfterClick=todo.done;
$scope.todoText = todo.text;
};
}]);
Angular 1.2 RCx で壊れたフィドル - http://jsfiddle.net/supercobra/ekD3r/
Angular 1.0.0での動作確認済み。 - http://jsfiddle.net/supercobra/8FQNw/
どのように解決するのですか?
を変更してはいかがでしょうか。
<input type='checkbox' ng-click='onCompleteTodo(todo)' ng-model="todo.done">
から
<input type='checkbox' ng-change='onCompleteTodo(todo)' ng-model="todo.done">
から ドキュメント :
ユーザが入力を変更したときに、与えられた式を評価します。モデルから値が変更された場合は評価されない。
注意:このディレクティブは
ngModel
が存在する必要があります。
関連
-
[解決済み] Ng-modelでコントローラの値が更新されない
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] クリック可能なラベルを持つチェックボックスを作成するには?
-
[解決済み] JavaScriptによるチェックボックスのチェック/アンチェック
-
[解決済み] AngularJSでチェックボックスの値のリストにバインドするにはどうすればいいですか?
-
[解決済み] jQuery チェックボックスの変更とクリックイベント
-
[解決済み] チェックボックスがチェックされているかどうかをjQueryでテストする
-
[解決済み] ng-modelとng-bindの違いは何ですか?
-
[解決済み] HTMLのチェックボックスのchecked属性の適切な値は何ですか?
-
[解決済み】チェックボックスがチェックされているかどうかをjQueryで確認する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] AngularJSで$httpリクエスト中にスピナーGIFを表示する?
-
[解決済み] ページロード時にAngularJSのコントローラ関数を実行する方法は?
-
[解決済み] Angular ng-repeatの条件付きラップアイテム(ng-repeatのグループアイテム)。
-
[解決済み] エラーです。10回の$digest()反復に達しました。動的なsortby述語で中断!?
-
[解決済み] createspyとcreatespyobjの違いは何ですか?
-
angularjs が src で指定されたコンテンツを iframe 内で正しく表示しない
-
AngularJSのベストプラクティス。ng-repeatの$indexに注意する。
-
AngularJS がエラー $digest already in progress を報告する
-
[解決済み] AngularJs .$setPristineでフォームをリセットする
-
[解決済み] ServiceとFactoryで迷う