javascript - ng-show 用于 ng-repeat 中的特定元素

Question

我似乎无法解决这个小问题：

<ul ng-repeat="parent in parents">
  <li>Mother: <i>{{parent.mother}}</i></li>
  <li>Father: <i>{{parent.father}}</i></li>
  <a href="#" ng-click="showKids()">Show Kids</a>
  <ul ng-repeat="kid in parent.kids" ng-show="active">
    <li>{{kid.name}}</li>
  </ul>
</ul>

http://jsfiddle.net/twSFK/5/

当我单击“显示孩子”时，我只想显示我单击的父母的孩子，而不是另一个。所以我需要某种索引用于我在 ng-show 中使用的模型，以仅针对特定元素。

由于 $scope.parents 来自后端服务器并加载了 ng-init，我不知道如何在控制器写入列表之前访问它以添加“活动”元素。

Answer 1

您可以设置迭代器索引ng-repeat="parent in parents"并使用它来玩两个功能：showKids(index)当您单击孩子列表时，将标记哪些父列表应该变为活动状态，以及isShowing(index)为了知道您应该显示哪些孩子子列表ng-show

我在这里根据我的想法重写了你的代码http://jsfiddle.net/odiseo/twSFK/7/