The problem is in binding the state of the checkbox (checked/unchecked) to the object values.
HTML:
<div ng:controller="Ctrl">
<div ng:repeat="(letter, number) in obj">
{{letter}} and {{number}}
<input type="checkbox" ng:model="obj[letter]">
</div>
Controller:
function Ctrl() {
this.obj = {a:true,b:true};
};
When the first checkbox is clicked it affects the state of the second checkbox, but the model is correct, so obj becomes {a:false, b:true}.
Example can be found at http://jsfiddle.net/alexpetrov/tRxzr/
How to fix this?
Bind ng-repeat to objects rather than primitive types.
function Ctrl() {
this.obj = [{id: 'a', checked: true}, {id: 'b', checked: true}];
}
Binding to primitive types confuses ng-repeat, it's a bug: https://github.com/angular/angular.js/issues/933
When the JSON is not entirely in your control, you get a primitive array instead of an object. You want to do an ng-repeat on the same.
To bind ng-repeats to checkboxes to a primitive array and get the selected items. See the plunker code here.