在特定对象中显示图标

Question

我使用ng-repeat渲染列表，如下所示：

<div ng-repeat="pet in pets">
  <h2 ng-bind="pet.name"></h2>
  <i class="icon favorite" ng-class="pet.fav ? 'ion-ios7-heart' : 'ion-ios7-heart-outline'" ng-click="toggleFav(pet._id,$event)"></i>
  <i class="LOADING ICON TO SHOW" ng-show="something?"></i>
</div>

心形按钮用于切换项目的“喜欢”。当用户点击它时，我想隐藏那个心脏并显示另一个图标（加载）。但仅限于点击项目。

我正在尝试ng-show，但这显然是在我列表的所有项目中显示/隐藏心脏。

有人有一些想法（或许有$index的东西），或者在项目中不得不做类似的事情？

谢谢！

Answer 1

这是一种方法。

在控制器中创建一个名为currentIndex的属性，并在用户点击心形图标时通过向该函数发送$ index将其设置在toggleFav函数中。

然后在你的ng-show中，你可以使用ng-show =＆＃34; currentIndex == $ index＆＃34;并且你可以在完成后将currentIndex重置为-1或其他东西。