219

我想使用父列表(foos)的索引作为子列表(foos.bars)中函数调用的参数。

我发现有人推荐使用 $parent.$index 的帖子,但$index它不是$parent.

如何访问父级的索引ng-repeat

<div ng-repeat="f in foos">
  <div>
    <div ng-repeat="b in foos.bars">
      <a ng-click="addSomething($parent.$index)">Add Something</a>
    </div>
  </div>
</div>
4

6 回答 6

282

我的示例代码是正确的,问题出在我的实际代码中。尽管如此,我知道很难找到这样的例子,所以我会回答它以防其他人正在寻找。

<div ng-repeat="f in foos">
  <div>
    <div ng-repeat="b in foos.bars">
      <a ng-click="addSomething($parent.$index)">Add Something</a>
    </div>
  </div>
</div>
于 2013-02-11T22:51:09.630 回答
220

根据 ng-repeat 文档http://docs.angularjs.org/api/ng.directive:ngRepeat,您可以将键或数组索引存储在您选择的变量中。(indexVar, valueVar) in values

所以你可以写

<div ng-repeat="(fIndex, f) in foos">
  <div>
    <div ng-repeat="b in foos.bars">
      <a ng-click="addSomething(fIndex)">Add Something</a>
    </div>
  </div>
</div>

使用 $parent.$index 上一层仍然很干净,但是上一层父母,事情可能会变得一团糟。

注意:$index将在每个范围内继续定义,不会被fIndex.

于 2013-09-20T10:52:17.027 回答
46

看看我对类似问题的回答
通过别名$index,我们不必编写像$parent.$parent.$index.


$parent.$index使用ng-init 的方式更优雅的解决方案:

<ul ng-repeat="section in sections" ng-init="sectionIndex = $index">
    <li  class="section_title {{section.active}}" >
        {{section.name}}
    </li>
    <ul>
        <li class="tutorial_title {{tutorial.active}}" ng-click="loadFromMenu(sectionIndex)" ng-repeat="tutorial in section.tutorials">
            {{tutorial.name}}
        </li>
    </ul>
</ul>

Plunker:http ://plnkr.co/edit/knwGEnOsAWLhLieKVItS?p=info

于 2014-01-03T20:48:38.593 回答
12

您还可以通过以下代码控制祖父索引

$parent.$parent.$index
于 2015-11-16T06:44:15.087 回答
2

您可以简单地使用 use $parent.$index 。其中 parent 将表示父重复对象的对象。

于 2015-10-08T09:59:41.690 回答
0

如果有多个父母,$parent 将不起作用。取而代之的是,我们可以在 init 中定义一个父索引变量并使用它

<div data-ng-init="parentIndex = $index" ng-repeat="f in foos">
  <div>
    <div data-ng-init="childIndex = $index" ng-repeat="b in foos.bars">
      <a ng-click="addSomething(parentIndex)">Add Something</a>
    </div>
  </div>
</div>
于 2017-11-29T09:50:12.653 回答