Question

一旦我意识到ng-model指令是如何工作的，并且对它的行为绝对有信心，这个例子就让我大吃一惊

<html ng-app>
<head>
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet">
</head>
<body ng-init="names = ['Sam', 'Harry', 'Sally']">
    <h1>Fun with Fields and ngModel</h1>
    <p>names: {{names}}</p>
    <h3>Binding to each element directly:</h3>
    <div ng-repeat="name in names">
        Value: {{name}}
        <input ng-model="name">                         
    </div>
    <p class="muted">The binding does not appear to be working: the value in the model is not changed.</p>
    <h3>Indexing into the array:</h3>
    <div ng-repeat="name in names">
        Value: {{names[$index]}}
        <input ng-model="names[$index]">                         
    </div>
    <p class="muted">Type one character, and the input field loses focus. However, the binding appears to be working correctly.</p>
</body>

ng-repeat fiddle。主要问题是三个不同版本的角度行为。我知道ng-repeat为每个数组项创建一个新的范围，我想（不确定）它只跟踪数组引用及其大小（因此，数组项不应该导致$ digest循环更改），但是，我们'我来到这里（只看第一个没有使用$ index的例子）：版本1.0.3＆lt;我们有预期的行为：用输入改变'name'属性只会改变ngModelController的值（范围继承），这是公平的，1.1.1 - 好吧，那里发生了什么：我们甚至没有在输入中得到新值！我们不会重新渲染我们的项目，因为我们不会失去焦点（而且我真的不明白为什么$ digest循环触发值替换此输入，因为Artem有said），第三个版本 - 1.2.1：更改输入值也会更改外部作用域中的“名称”值（据我所知，ngModelController应该继承由ng-repeat指令创建的作用域）。那么，在这三个例子中究竟发生了什么（以及为什么）？

Answer 1

使用Angular最新版本（1.2.1）并按$ index跟踪。此问题已修复

http://jsfiddle.net/rnw3u/55/

    <div ng-repeat="name in names track by $index">
        Value: {{names[$index]}}
        <input ng-model="names[$index]">                         
    </div>

ng-repeat中的Angular NgModelController行为

1 个答案: