查看数组的子值 [英] Watching subvalues of array

问题描述

我有一个带有项目的动态 array，它看起来像这样:

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

我想在 checked 值发生变化时做出反应，并知道它在哪个项目上发生了变化.

我怎样才能做到这一点?

解决方案

您可以将 ng-change 事件注册到绑定的复选框.如果您确实想添加手表，则可以使用深度手表选项.$scope.$watch('items', fn, true).但是，除非绝对需要，否则我不会使用观察者.

示例:-

<input type="checkbox" ng-model="item.checked" ng-change="carSelected(item)"/>{{item.name}}</label>

angular.module('app', []).controller('ctrl', function($scope) {$scope.items = [{编号:1，name: '福特',检查:错误}, {编号:2，name: '梅赛德斯',检查:正确}, {编号:3，名称:'宝马',检查:错误}];$scope.carSelected = 功能(项目){//对选中的对象做一些事情控制台日志(项目)；}$scope.$watch('items', function(){console.log("项目已更新");}， 真的)})

<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>{{项目}}

I have a dynamic array with items, which could look like this:

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

I want to react whenever a checked value is changed, and know which item it was changed on.

How can I achieve this?

解决方案

You could register an ng-change event to the check boxes bound. If you indeed really want to add a watch you can use the deep watch option. $scope.$watch('items', fn, true). However i will not to use a watcher unless it is absolutely required.

Example:-

<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>

这篇关于查看数组的子值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！