Question

在Knockout JS中，是否可以增加2的foreach？类似于：

for (var i = 0; i < array.length; i += 2) {
    // Do stuff
}

我想这样做的原因是因为我需要循环的数据是一个数组而不是一个对象。示例：

viewModel = function () {
    this.facets = ["Sample", 100, "Sample 2", 200];
}

但数据需要显示如下：

<ul data-bind="foreach: facets"> <!-- Can this foreach be incremented by 2? -->
    <li>$data[$index]: $data[$index + 1]</li>
</ul>

非常感谢任何帮助。

Answer 1

你可以为此编写一个自定义绑定处理程序，但我宁愿让这些模板免于这些丑陋的细节。

我建议写一个ko.computed：

function Model() {
    this.data = ko.observableArray(["Sample", 100, "Sample 2", 200])
    this.items = ko.computed(function() {
        var value = [];
        var data = this.data();
        for (var i=0; i<data.length; i+=2) {
            value.push({ key: data[i], value: data[i+1]);
        }
        return value;
    }, this);
}

var model = new Model();

现在，您可以遍历模板中的items并访问key和value。更新原始data数组将自动重建items计算的observable。

模板代码如下：

<ul data-bind="foreach: items">
    <li><span data-bind="text: key"></span>: <span data-bind="text: value"></span></li>
</ul>

Answer 2

我的重复绑定（https://github.com/mbest/knockout-repeat）允许您指定step选项。

<ul>
    <li data-bind="repeat: {foreach: facets, step: 2}"
        data-repeat-bind="text: facets[$index] + ': ' + facets[$index+1]">
    </li>
</ul>

Answer 3

这可能就是你要找的东西：

for (var i = 0; i < array.length; i += 2) {
    var sample = array[i];
    var number = array[i+1];
    var display = "<li>" + sample + ": " + number + "</li>" // display this
}

看起来你已经拥有它，所以我不确定是什么问题......

Answer 4

您可以使用函数创建需要绑定到的结构：

 self.arrayFunc = function() {
    var result = [];

    for (var i = 0, length = array.length; i += 2) {
        result.push({first: array[i], second: [i + 1]};
    }

};

Knockout JS：foreach增加2

4 个答案: