javascript – 如何访问和使用ng-repeat内的每个项目的索引

前端之家收集整理的这篇文章主要介绍了javascript – 如何访问和使用ng-repeat内的每个项目的索引前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个表,每行中最后一列包含一个加载图标,当单击表中的按钮时,我希望显示.

当每个表行都使用ng-repeat生成时,加载器将显示在每一行中,而不是单个行中.只能点击当前索引,如何将ng-show设置为true或false?

模板:

<tr ng-repeat="record in records">
  <td>{{ record.name }}</td>
  <td><a ng-click="someAction(record.name)">Some Action</a></td>
  <td ng-show="loading">Loading...</td>
</tr>

控制器:

$scope.someAction = function(recordName) {
  $scope.loading = true;
};

解决方法@H_502_14@
您可以传入$index参数并设置/使用相应的索引. $index可以在ng重复的范围内自动使用.
<td><a ng-click="someAction(record.name,$index)">Some Action</a></td>
<td ng-show="loading[$index]">Loading...</td>


$scope.someAction = function(recordName,$index) {
  $scope.loading[$index] = true;
};

下面是一个通用示例,其中所有的逻辑视图为方便起见:Live demo (click).

<div ng-repeat="foo in ['a','b','c']" ng-init="loading=[]">
  <p ng-click="loading[$index]=true">Click me! Item Value: {{foo}}<p>
  <p ng-show="loading[$index]">Item {{$index}} loading...</p>
</div>

猜你在找的JavaScript相关文章