家长ng-repeat的访问索引。

时间:2022-11-25 15:51:05

I want to use the index of the parent list (foos) as an argument to a function call in the child list (foos.bars).

我希望将父列表(foos)的索引用作子列表(foo .bars)中的函数调用的参数。

I found a post where someone recommends using $parent.$index, but $index is not a property of $parent.

我找到了一个帖子,有人推荐使用$parent。$index,但是$index不是$parent的属性。

How can I access the index of the 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>

6 个解决方案

#1


268  

My example code was correct and the issue was something else in my actual code. Still, I know it was difficult to find examples of this so I'm answering it in case someone else is looking.

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

<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>

#2


211  

According to ng-repeat docs http://docs.angularjs.org/api/ng.directive:ngRepeat, you can store the key or array index in the variable of your choice. (indexVar, valueVar) in values

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

so you can write

所以你可以写

<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>

One level up is still quite clean with $parent.$index but several parents up, things can get messy.

一个层次上仍然是非常干净的$parent。$index但是一些父母,事情会变得一团糟。

Note: $index will continue to be defined at each scope, it is not replaced by fIndex.

注:$index将继续在每个范围内定义,它不会被fIndex所替代。

#3


41  

Take a look at my answer to a similar question.
By aliasing $index we do not have to write crazy stuff like $parent.$parent.$index.

看看我对类似问题的回答。通过调整$index,我们不需要编写像$parent.$parent.$index这样的疯狂的东西。


Way more elegant solution whan $parent.$index is using ng-init:

更优雅的解决方案whan $parent。美元指数是使用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

砰砰作响:http://plnkr.co/edit/knwGEnOsAWLhLieKVItS?p=info

#4


12  

You can also get control of grand parent index by the following code

您还可以通过以下代码获得grand parent索引。

$parent.$parent.$index

#5


2  

You can simply use use $parent.$index .where parent will represent object of parent repeating object .

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

#6


-1  

$parent doesn't work if there are multiple parents. instead of that we can define a parent index variable in init and use it

如果父母多,父母就不工作。我们可以在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>

#1


268  

My example code was correct and the issue was something else in my actual code. Still, I know it was difficult to find examples of this so I'm answering it in case someone else is looking.

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

<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>

#2


211  

According to ng-repeat docs http://docs.angularjs.org/api/ng.directive:ngRepeat, you can store the key or array index in the variable of your choice. (indexVar, valueVar) in values

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

so you can write

所以你可以写

<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>

One level up is still quite clean with $parent.$index but several parents up, things can get messy.

一个层次上仍然是非常干净的$parent。$index但是一些父母,事情会变得一团糟。

Note: $index will continue to be defined at each scope, it is not replaced by fIndex.

注:$index将继续在每个范围内定义,它不会被fIndex所替代。

#3


41  

Take a look at my answer to a similar question.
By aliasing $index we do not have to write crazy stuff like $parent.$parent.$index.

看看我对类似问题的回答。通过调整$index,我们不需要编写像$parent.$parent.$index这样的疯狂的东西。


Way more elegant solution whan $parent.$index is using ng-init:

更优雅的解决方案whan $parent。美元指数是使用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

砰砰作响:http://plnkr.co/edit/knwGEnOsAWLhLieKVItS?p=info

#4


12  

You can also get control of grand parent index by the following code

您还可以通过以下代码获得grand parent索引。

$parent.$parent.$index

#5


2  

You can simply use use $parent.$index .where parent will represent object of parent repeating object .

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

#6


-1  

$parent doesn't work if there are multiple parents. instead of that we can define a parent index variable in init and use it

如果父母多,父母就不工作。我们可以在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>