淘汰赛“为”绑定？答案

【问题标题】：Knockout 'for' binding?淘汰赛“为”绑定？
【发布时间】：2013-04-18 17:43:12
【问题描述】：

原始问题

是否有人拥有或知道用于淘汰赛的绑定，该绑定将允许类似于 for 循环的行为？我可以让 foreach 做我想做的事，但如果我不必那样做就好了。

编辑 2

我正在尝试根据用户所做的选择来创建表格行。在某些情况下，我需要 x 行，其中 x 是数组的长度，有时 x 表示显示 n 个数组所需的最大行数。

例如：image1 是基于 4 个不同的数组构建的，这些数组的大小各不相同 image2 是从同一个数组构建的，在这种情况下是双倍的。

<div data-bind="if: selectedTab()">
<table>
<thead>
  <tr>
    <td>
      <div class="a-i-post-All"></div>
    </td>
    <!-- ko foreach:$root.selectedTab().races-->
    <td>
      <input type="checkbox" />
    </td>
    <!-- /ko -->
  </tr>
</thead>
<tbody data-bind="foreach: selectedTab().runners"> // <-- This is an empty array created by the max number of Runners in the selectedTabs array of Races
  <tr>
    <td>
      <div class="a-i-post"></div>
    </td>
    <!-- ko foreach:$root.selectedTab().races-->
    <td>
      <!-- ko if: Runners.length > $parentContext.$index()-->
      <input type="checkbox" />
      <!-- /ko -->
    </td>
    <!-- /ko -->
  </tr>
</tbody>

以上工作正常并创建我想要的，但我不喜欢将 selectedTab.runners 从一个数字变成一个空数组，只是为了让它循环 n 次来创建行。我愿意接受建议。注意在我最初发布这个问题时，我已经对这段代码进行了相当大的修改，现在只发生了一次与我最初的问题相关的情况。

【问题讨论】：

你为什么不想将 foreach 与 $index 一起使用？
我希望能够对数字而不是数组进行 foreach
这并不是 Knockout 的真正用途。我试图想一个现实世界的例子，你需要在 JavaScript 中重复定义 x 的次数，在第一次生成视图时不能简单地在服务器端完成。我不知所措。也许，如果你真的告诉我们你真正想要做什么，有人可以告诉你一个更好的方法。
是的，问题是循环的每个实例都没有要绑定的数据，因为它实际上并不存在。

标签： javascript knockout.js knockout-2.0

【解决方案1】：

我的Repeat 绑定正是这样做的。

<tbody>
  <tr data-bind="repeat: { foreach: selectedTab().runners, index: '$runner' }">
    <td>
      <div class="a-i-post"></div>
    </td>
    <td data-bind="repeat: selectedTab().races">
      <!-- ko if: $item().Runners.length > $runner -->
      <input type="checkbox" />
      <!-- /ko -->
    </td>
  </tr>
</tbody>

【讨论】：

感谢您解决我最初的问题。这似乎确实符合我的要求，但此时我已经重构了我的代码，可能不再需要处理此类操作，更少出于性能原因使用它。
这看起来很有趣，迈克尔！

【解决方案2】：

你可以创建一个数组对象：

  <!-- ko foreach: new Array(the_length_you_need) -->
       <span>&#9733;</span>
  <!-- /ko -->

这将打印 the_length_you_need 次

【讨论】：

【解决方案3】：

你可以这样做：

<div data-bind="foreach: [0,0,0,0,0]">
    <span data-bind="text: $index"></span>
</div>

你会得到元素 0-4。

但是，正如 Chris 在 cmets 中所说，这似乎很奇怪。告诉我们您想要做什么，我们会为您指明正确的方向。

【讨论】：