Question

如果我尝试使用ng-repeat将某些字段数据绑定到数组，例如使用$index值，则输入会在1次击键后自动模糊。检查示例以查看我的意思。

（角度稳定1.2.4和最新测试：1.2.5，jsfiddle 1.1.1）

或html吼叫，同样的事情

<!doctype html>
<html ng-app>
  <head>
    <script src="js/angular.js"></script>
    <script type="text/javascript">
      function testController ($scope) {
        $scope.data = {
          a: 1,
          b: '2222',
          c: {
            d: 3,
            e: [1, 2, 3],
          }
        };
      }
    </script>
  </head>

  <body ng-controller="testController">
    Works: <label><input type="text" ng-model="data.c.e[1]" /></label>
    <br />
    Blurs after one keystroke:
    <label ng-repeat="no in data.c.e">
      <input type="text" ng-model="data.c.e[$index]" />
    </label>
    <pre>{{data | json}}</pre>
  </body>
</html>

Answer 1

我在AngularJS Google网上论坛上得到了Michael Hard的一个很好的答案：

https://groups.google.com/forum/#!topic/angular/q1U-9Dj7leU

解决方案是使用Angular＆gt; = 1.2.4（当前稳定的一个工作）并在track by中使用ng-repeat，又名：

<label ng-repeat="no in data.c.e track by $index">

整个代码：

<!doctype html>
<html ng-app>
  <head>
    <script src="js/angular.js"></script>
    <script type="text/javascript">
      function testController ($scope) {
        $scope.data = {
          a: 1,
          b: '2222',
          c: {
            d: 3,
            e: [1, 2, 3],
          }
        };
      }
    </script>
  </head>

  <body ng-controller="testController">
    Works: <label><input type="text" ng-model="data.c.e[1]" /></label>
    <br />
    Blurs after one keystroke:
    <label ng-repeat="no in data.c.e track by $index">
      <input type="text" ng-model="data.c.e[$index]" />
    </label>
    <pre>{{data | json}}</pre>
  </body>
</html>

Answer 2

这是因为每当值发生变化时，ng-repeat重绘。如果绑定到对象中的整数而不是数组，则它可以工作：

f: [{no:1},{no:2},{no:3}]
// ...
<input type="text" ng-model="data.c.f[$index].no" />

Fiddle

您可以观看类似的代理对象并使用它来更新阵列。

$scope.$watch("data.c.f", function(){
    $scope.data.c.e = [];
    $scope.data.c.f.forEach(function(obj){
        $scope.data.c.e.push(obj.no);
    })
}, true)

一次击键后Angularjs ng-repeat输入模糊

2 个答案: