本文介绍了阵列的看着子值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个动态的阵列的项目,这可能是这样的:

  $ scope.items = [
    {ID:1,名称:'福特',检查:假},
    {ID:2,名称:'奔驰',检查:真正},
    {ID:3,名称:'宝马',检查:假}
];

我要当一个检查反应值被改变,并且知道它是改变了哪个项目。

我怎样才能做到这一点?


解决方案

您可以注册一个 NG-变化事件绑定的复选框。如果你真的真的想添加一个手表,你可以使用深手表选项。 $范围。$腕表('项目',FN,真实)。不过我不会用一个守望者,除非它的绝对需要

例如: -

 <标签NG重复=中的项项跟踪由item.id>
&LT;输入类型=复选框NG模型=item.checkedNG变化=carSelected(项目)/>{{item.name}}</label>

\r
\r

angular.module(应用,[])。控制器(CTRL ,功能($范围){\r
  $ scope.items = [{\r
    ID:1,\r
    名称:'福特',\r
    检查:假的\r
  },{\r
    ID:2,\r
    名称:'奔驰',\r
    检查:真\r
  },{\r
    ID:3,\r
    名称:'宝马',\r
    检查:假的\r
  }];\r
\r
  $ scope.carSelected =功能(项目){\r
    //使用所选择的东西\r
    的console.log(项目);\r
  }\r
  \r
  $范围。$腕表('项目',函数(){\r
    的console.log(项目更新);\r
  },真)\r
})

\r

&LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r
&LT; D​​IV NG-应用=应用程序NG控制器=CTRL&GT;\r
  &LT;标签NG重复=中的项项跟踪由item.id&GT;\r
    &LT;输入类型=复选框NG模型=item.checkedNG变化=carSelected(项目)/>{{item.name}}</label>\r
  &所述p为H.;\r
    {{项目}}\r
&LT; / DIV&GT;

\r

\r
\r

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>

这篇关于阵列的看着子值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-24 11:35