"for loop" 用于淘汰赛

Question

我有一个页面，包含很多项目（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>

但这不起作用。

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

"for loop" 用于淘汰赛

"for loop" for knockoutjs

javascript

loops

knockout.js