如何在Angularjs中使用复选框函数访问表数据

How to have checkbox function access table data in Angularjs

本文关键字:复选框 函数 访问表 数据 Angularjs      更新时间:2023-09-26

我在Angularjs中有一个表,每一行都有一个checkbox。当点击checkbox时,我想要一个警报功能,以显示被点击行的内容。我面临的问题是警报函数如何访问该行的数据内容?

html中的表是这样的;

<table class="table table-hover data-table sort display">
<thead>
  <tr>
    <th>Name</th>
    <th>Location</th>   
    <th>Checkbox Alert</th>
  </tr>
</thead>
<tbody>
  <tr ng-repeat="item in filteredList | orderBy:columnToOrder:reverse">  
    <td>{{item.name}}</td>
    <td>{{item.location}}</td>  
    <td> <input type="checkbox" ng-click="alert_display()"> </td>
  </tr>
</tbody>
</table>

控制器代码如下;

$scope.alert_display = function()
{
    alert("Testing");
};

我希望alert_display()显示{{item.name}}{{item.location}}的相关行的内容。

执行以下操作:

<input type="checkbox" ng-model="selected" ng-change="display(selected, item)">

你的JS代码:

$scope.display = function(selected, item) {
    if(selected)
         alert(item.name + ' ' + item.location);
    else
         // do sth else
}

这里是小提琴:http://jsfiddle.net/HB7LU/4156/