淘汰赛的“for循环”答案

【问题标题】："for loop" for knockoutjs淘汰赛的“for循环”
【发布时间】：2019-10-03 18:44:36
【问题描述】：

我有一个页面，包含很多项目（observablearray），所以我创建了一个分页系统。（好吧，不是我自己创建的，而是从这里复制的How to handle pagination with Knockout ;)）

我想在每页显示单个按钮。比如：

<  1 2 3 4  >

我有“totalPages”属性，但如何在前端使用它？

如何循环遍历一个淘汰的 int 变量并创建指向具有相同 int 的函数的链接？

我希望是这样的：

<ul data-bind="foreach: totalPages">
    <li><a href="#" data-bind="text: $index, click: pageNumber($index)"></li>
</ul>

但这不起作用。

【问题讨论】：

标签： javascript loops knockout.js

【解决方案1】：

您可以使用Array.from() 创建一个空数组并在foreach 中使用它。为click 函数添加一个包装器，以获取$index() + 1 作为参数：

const viewModel = {
  totalPages: ko.observable(4),
  pageNumber: n => console.log(n)
}

ko.applyBindings(viewModel)

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<ul data-bind="foreach: Array.from({ length: totalPages() })">
    <li>
      <a href="#" data-bind="text: $index() + 1, click: () => $parent.pageNumber($index() + 1)"></a>
    </li>
</ul>

【讨论】：