Question

$scope.arr = [
[["TTT", 23],3],
[["PPP", 23],3],
[["KKK", 23],3]
];

我需要在数组的arr [0] [0] [0]元素上应用watch。

在文本框中使用ng-model到ng-repeat对所有数组渲染arr [0] [0] [0]，arr [1] [0] [0]，arr [2] [0] [0]

如果我在文本框中输入内容，如何在ng-model变量上应用watch？

我尝试在整个数组arr上应用watch但是它没有在watch函数下面触发

 $scope.$watch($scope.arr, function (newVal, oldVal) 
{ 
 $log.log(newVal);
}
);

HTML：

<div  ng-repeat="el in arr">
Name: <input type="text" ng-model = "el[0][0]" />
</div>

Answer 1

如果您只想观看带有数组的特定元素，可以使用Angular Scope的$ watchGroup方法来观察多个表达式。试试下面的例子。

angular.module("myApp", []).controller("TestCtrl", function($scope) {
  $scope.arr = [
    [
      ["TTT", 23], 3
    ],
    [
      ["PPP", 23], 3
    ],
    [
      ["KKK", 23], 3
    ]
  ];
  $scope.$watchGroup($scope.arr.map((a, i) => "arr[" + i + "][0][0]"), function(newVals, oldVals) {
    alert("Updated from " + oldVals + " to:" + newVals);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

<body ng-app="myApp">
  <div ng-controller="TestCtrl">
    <div ng-repeat="el in arr">
      Name:
      <input type="text" ng-model="el[0][0]" />
    </div>
  </div>
</body>

Answer 2

似乎问题在于为ng-repeat的每次迭代生成一个新的范围。为了解决这个问题，您可以为每次迭代附加一个单独的控制器，如解释here。

在没有多个控制器的情况下，我能想到的最简单的方法是使用ng-change指令，如下所示：

JS：

$scope.getChanged = function(newValue) {
  alert('getChanged(), new value: ' + newValue);
}

HTML：

<input type="text" ng-model="a[0][0]" ng-change="getChanged(a[0][0])" />

这是fiddle显示它的实际效果。

如何观察数组数组的数组属性？

2 个答案: