title: Binding checkboxes to object values in AngularJs
body: <p>The problem is in binding the state of the checkbox (checked/unchecked) to the object values.</p>
  
  <p>HTML:
      </p>
  
  <pre><code>&lt;div ng:controller="Ctrl"&gt; 
     &lt;div ng:repeat="(letter, number) in obj"&gt;
       {{letter}} and {{number}}
       &lt;input type="checkbox" ng:model="obj[letter]"&gt;
  &lt;/div&gt;    
  </code></pre>
  
  <p>​</p>
  
  <p>Controller: 
      </p>
  
  <pre><code>function Ctrl() {
      this.obj = {a:true,b:true};    
  };​
  </code></pre>
  
  <p>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}.</p>
  
  <p>Example can be found at
  <a href="http://jsfiddle.net/alexpetrov/tRxzr/" rel="nofollow">http://jsfiddle.net/alexpetrov/tRxzr/</a></p>
  
  <p>How to fix this?</p>