范围不在angularjs中的ng-repeat之外工作

Question

HTML

<ul>
    <li ng-repeat="obj in strA">
       obj.str = {{obj}}
       <input ng-model="obj" />
    </li>
</ul>
obj in <code>{{ strA.a1 }}</code> 
obj in <code>{{ strA.a2 }}</code>

调节器

$scope.strA = {
  a1: "abc",
  a2: "bcd"
};

当我更改文本框中的值时,ng-repeat内的obj会发生变化.但包装的价值不要改变

这是codepen:http://codepen.io/anon/pen/vLyrxm
为什么会这样？据我所知,这两个价值都应该改变

Answer 1

ngRepeat创建新的子范围.这意味着在每次重复中li都有一个新范围,并且使用ngMOdel绑定到此本地范围.你可以这样做:

<li ng-repeat="(key, value) in strA">
    obj.str = {{value}}
    <input ng-model="strA[key]" />
</li>

演示: http ://codepen.io/anon/pen/adBKVd？编辑= 101