如果在knockoutjs中有3个嵌套的foreach，如何得到第二个foreach的$ index

Question

如果我们有3个嵌套的foreach，如何在最里面的foreach中获得第二个foreach的$ index？ $ index为我们提供了最里面的foreach计数器，$ parentContext给了我们最外层的foreach计数器。中间的foreach怎么样？

Answer 1

您可以根据需要多次向上移动$parentContext。所以：$index()＆gt; $parentContext.$index()＆gt; $parentContext.$parentContext.$index() ...

以下示例显示

1. 有效，
2. 它很难看，容易出错...

更好的解决方案是在实际项目中包含（计算的）索引属性。

ko.applyBindings({
  items: [{
      items: [{
          items: [1, 2, 3]
        },
        {
          items: [4, 5, 6]
        }
      ]
    },
    {
      items: [{
        items: [7, 8, 9],
      }, {
        items: [0, 1]
      }]
    }
  ]
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<ul data-bind="foreach: items">
  <li>
    <strong data-bind="text: $index()"></strong>
    <ul data-bind="foreach: items">
      <li>
        <strong data-bind="text: [
          $parentContext.$index(),
          $index()].join('.')"></strong>
        <ul data-bind="foreach: items">
          <li>
            <strong data-bind="text: [
              $parentContext.$parentContext.$index(),
              $parentContext.$index(),
              $index()].join('.')"></strong>
          </li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

Answer 2

在这里你可以找到与jsfiddle demo类似的问题： Getting $index of grand parent in a nested loop