Question

我想知道在淘汰赛中是否有办法创建dom项目，类似于foreach绑定如何工作，使用只有整数的observable？

例如

var viewModel = function(){
    this.item = ko.observableArray(["1","2","3"]);

    }

这将在使用foreach绑定时创建3个dom元素。在哪里我想看到以下产生三个dom项目。

 var viewModel = function(){
        this.item = ko.observable(3);

        }

一个补充是最终结果需要是动态的，所以如果值改变了dom项也是如此。

Answer 1

Artem Vyshniakov的答案非常好，但是当你没有绑定到那些创建元素的数据时，它们主要是有用的。

如果您需要根据计数创建元素，但它们也有来自数组的数据，那么要创建限制计数：

var data = [{ "Name": "John", "Age" : 20 },{ "Name": "Mike", "Age" : 30 },{ "Name": "Tom", "Age" : 40 },{ "Name": "Sam", "Age" : 50 }];

function vm(){
    var self = this;
    self.itemCount = ko.observable(3);
    self.items = ko.observableArray(data);
    self.limitedItems = ko.computed(function(){
        var ctr = 0;
        return ko.utils.arrayFilter(self.items(), function(item){
            ctr++
            return ctr <= self.itemCount() ? item : false;
        });
    });
}

ko.applyBindings(new vm());

因此，您可以控制集合中的元素数量：

<input data-bind="value: itemCount, valueUpdate: 'afterkeydown'" />

<ul data-bind="foreach: limitedItems">
    <li data-bind="text: Name + ', ' + Age"></li>
</ul>

淘汰foreach数而不是数组项

1 个答案: