父ng-repeat对子ng-repeat的访问索引

2020/10/14 05:41 · javascript ·  · 0评论

我想使用父列表(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>

我的示例代码是正确的,问题出在我的实际代码中。不过,我知道很难找到这样的例子,因此我在回答别人的情况。

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

根据ng-repeat docs 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

看看我对类似问题的回答

通过别名,
$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

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

$parent.$parent.$index

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

如果有多个父母,则$ 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>
本文地址:http://javascript.askforanswer.com/fung-repeatduizing-repeatdefangwensuoyin.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!