我是Angular JS新手，我正在尝试使用ng-repeat在我的表中生成多行，在每行中应该有一个按钮来触发具有不同参数的函数
<div ng-controller="testing">
<table>
<thead>
<tr>
<th>col 1</th>
<th>col 2</th>
<th>button</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items">
<td>{{ item.prop1 }}</td>
<td>{{ item.prop2 }}</td>
<td><button ng-click="myFunction(item.id)">Trigger Function</button></td>
</tr>
</tody>
</table>
</div>当然这是行不通的，因为ng-repeat创建了自己的作用域，而myFunction是在父作用域（即测试控制器）中定义的。
然而，我在Google搜索结果中只能找到不工作的原因，但却没有解决问题的方法。我应该如何修改代码，使ng-click工作？有没有办法在ng-repeat作用域中定义myFunction，或者有没有办法告诉我希望函数在父作用域中？
2条答案
按热度按时间vwkv1x7d1#
将
ng-click更改为以下内容ijxebb2r2#
提高ng-repeat性能-将跟踪方式与ng-repeat一起使用
传递$index来跟踪你的ng-repeat以及点击了哪个ng-click
<ul class="tasks"> <li ng-repeat="task in tasks" ng-class="{done: task.done}"> {{task.id}}: {{task.title}} </li> </ul>供参考
也许你在Angular学到的第一件事就是如何使用ngRepeat。它是如此的简单和容易，你一定会喜欢它。下面是一个例子：
<ul class="tasks"> <li ng-repeat="task in tasks" ng-class="{done: task.done}"> {{task.id}}: {{task.title}} </li> </ul>个“问题是”
现在，假设您在该列表上方有一个按钮来刷新它。
这种更新的明显实现是在控制器中沿着以下操作：
$scope.tasks = newTasksFromTheServer;这是一段很简单的代码，但是它会导致ngRepeat删除现有任务的所有li元素，然后重新创建它们，这可能会很昂贵（例如，我们有很多li元素，或者每个li的模板都很复杂）。这意味着需要很多DOM操作。
Angular为什么要这样做呢？在幕后ngRepeat为每个任务添加了一个$$hashKey属性来跟踪它。如果你用服务器上的新任务对象替换原来的任务，即使它们实际上和你原来的任务完全一样，它们也不会有$$hashKey属性，所以ngRepeat不会知道它们代表了相同的元素。
*追踪 * 前往救援
在Angular 1.2中，ngRepeat的语法新增了一项内容：这个子句允许你为ngRepeat指定你自己的键来标识对象，而不仅仅是生成唯一的ID。
这意味着您可以将上面的代码改为ng-repeat=“task in tasks track by task.id“，并且由于ID在原始任务和服务器更新的任务中是相同的- ngRepeat将知道不要重新创建DOM元素并重用它们。
如果数据源有重复数据，也可以使用“trackby $index”
//以下代码将引发错误：dupes Repeater中的重复键
<div ng-repeat="value in [4, 4]"></div>//下面的代码将完全正常工作
<div ng-repeat="value in [4, 4] track by $index"></div>