Angularjs ng-model inside ng-repeat via (key,val) not updating

Question

Here is my not working demo

<section ng-repeat="t in test">
  <div ng-repeat="(key,value) in t">
    <div>{{key}}</div>
   <input type="text" ng-model="value"/>
  </div>
</section>

Model stays the same. How to sync? Please note, structure of data is important.

Answer 1

The ng-model binding will evaluate its expression on the current scope. As ng-repeat creates a child scope, this means that ng-model will look for a property named value on the child scope. In your example we'd expect it to look for the val property on the parent scope, which is aliased to t.

This is by design and can be circumvented in your case by referencing the parent scope t in the expression.

Working demo

Code (notice the binding on the input element has changed):

<section ng-repeat="t in test">
  <div ng-repeat="(key,value) in t">
    <div>{{key}}</div>
   <input type="text" ng-model="t[key]"/>
  </div>
</section>

As you're using a beta version of Angular 1.3, this may be a bug.