knockout.js - 如何根据模板中的数据绑定值重复元素

Question

尝试但未能在网上找到解决方案。希望这里有人知道。

我想在模板本身中找到一个解决方案而不做计算函数。

这是NumberPeople=5的示例。

<div id="listpeople" data-bind="text:NumberPeople"></div>

有没有办法在listpeople div 中显示 5 个图标？所以最终结果是：

<div id="listpeople" data-bind="{code here}">
    <span id="1">1</span>
    <span id="2">2</span>
    <span id="3">3</span>
    <span id="4">4</span>
    <span id="5">5</span>
</div>

Answer 1

您的问题在没有任何上下文的情况下似乎非常人为，因此答案可能会有点人为。这是执行您似乎要求的一种方法：

<div id="listpeople" data-bind="foreach: new Array(NumberPeople)">
    <span data-bind="text: $index()+1, attr: {id: $index()+1}"></span>
</div>

视图模型很简单，没有计算函数：

var vm = { NumberPeople: 5 };
ko.applyBindings(vm);

看到这个 jsfiddle。

我确实推测上述内容可能不完全适合您想要实现的目标。如果是这样，您可能会遇到XY 问题。如果没有：享受！:D