观察数组的子值

Question

我有一个包含项目的动态 array，它可能如下所示：

$scope.items = [
    {id: 1, name: 'Ford', checked: false},
    {id: 2, name: 'Mercedes', checked: true},
    {id: 3, name: 'BMW', checked: false}
];

我想在 checked 值更改时做出反应，并知道更改了哪个项目。

我怎样才能做到这一点？

Answer 1

您可以向绑定的复选框注册一个 ng-change 事件。如果你确实真的想添加一个手表，你可以使用 deep watch 选项。 $scope.$watch('items', fn, true)。但是，除非 绝对需要 .

，否则我不会使用观察者

示例：-

<label ng-repeat="item in items track by item.id">
<input type="checkbox" ng-model="item.checked" ng-change="carSelected(item)" />{{item.name}}</label>

angular.module('app', []).controller('ctrl', function($scope) {
  $scope.items = [{
    id: 1,
    name: 'Ford',
    checked: false
  }, {
    id: 2,
    name: 'Mercedes',
    checked: true
  }, {
    id: 3,
    name: 'BMW',
    checked: false
  }];

  $scope.carSelected = function(item) {
    //Do something with the selected
    console.log(item);
  }
  
  $scope.$watch('items', function(){
    console.log("Item updated");
  }, true)
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <label ng-repeat="item in items track by item.id">
    <input type="checkbox" ng-model="item.checked" ng-change="carSelected(item)" />{{item.name}}</label>
  <p>
    {{items}}
</div>

观察数组的子值

Watching subvalues of array

javascript

angularjs

angularjs-scope