角度：对象数组中的 $watch 对象答案

【问题标题】：angular: $watch object in array of objects角度：对象数组中的 $watch 对象
【发布时间】：2016-10-19 08:56:01
【问题描述】：

例如，我有一个对象数组。

$scope.items = [
    {id: 1, name: 'one'},
    {id: 2, name: 'two'},
    {id: 2, name: 'three'}
];

并且在模板中有类似的东西

<div ng-repeat="item in items">
    <input type="text" ng-model="item.name" />
</div>

我想添加$watch 到这个like（用于跟踪输入的变化）

$scope.$watch('item', function(newVal){}, true);

如果我想在newVal 中拥有像{id: 1, name: 'one'} 这样的项目，我需要做什么？

不是对象数组！ newVal 中只有一个更改的对象！ 我无法在控制器中为数组的每个对象创建变量。

我尝试了类似的东西

for (var i = 0; i < $scope.items.length; i++) {
    $scope.$watch('items[' + i = ']', function(newVal) {
        console.log(newVal);
    }, true);
}

但那错了。

【问题讨论】：

@Cerbus 为什么你认为其他问题是相似的？所有数组都有变化，我只需要更改数组中的对象。

标签： javascript angularjs angular

【解决方案1】：

你可以试试

for (var i = 0; i < $scope.items.length; i++) {
    (function(k){
        $scope.$watch(function(){
            return $scope.items[k]
        }, function(newVal) {
            console.log(newVal);
        }, true);
    })(i);
}

注意：上面的代码我没有测试过；

【讨论】：

【解决方案2】：

试试这个。

var app = angular
  .module('MyApp', [])
  .controller('Main', ['$scope', function($scope) {
      var vm = this;
      vm.items = [
          {id: 1, name: 'one'},
          {id: 2, name: 'two'},
         {id: 2, name: 'three'}
       ];
   for (var i = 0; i < vm.items.length; i++) {
     $scope.$watch('ctrl.items[' + i + ']', function(newVal) {
        console.log(newVal);
       }, true);
     }
  }
]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="main-content" ng-app="MyApp" ng-controller="Main as ctrl">
<div ng-repeat="item in ctrl.items">
    <input type="text" ng-model="item.name" />
</div>
</div>

【讨论】：

这是唯一的值，不是所有的对象