knockout js显示可观察数组的子集

Question

我有一个600个项目（它们是任务提醒）的视图模型按照最旧到最新在一个名为workQueue的observableArray中显示为ul> li。这可能需要一些时间才能呈现。

我也在使用基诺排序。

<ul class="drop-target" data-bind="sortable: workQueue"> 
    <li data-bind="text: title"></li> 
</ul> 

我希望做的只是呈现列表的前20位，并且随着第一项被弹出下一个列表显示。如果用户过滤列表，则最多只能显示20个。

有没有可排序的方法：当我点击某个数时退出渲染。

Answer 1

没有，没有办法阻止渲染，当你打了一定的不扭捏的代码，但你可能要考虑使用一个计算的属性来模拟你喜欢这个指定的页面大小：

var ViewModel = function() { 
    var self = this; 
    var work = new Array(600); 
    for (var i = 0; i < work.length; i++) { 
     work[i] = { 
      name: i.toString() 
     }; 
    } 
    self.startPos = ko.observable(0); 
    self.pageSize = ko.observable(20); 
    self.workQueue = new ko.observableArray(work); 
    self.workQueue.paged = ko.computed(function() { 
     var start = self.startPos(); 
     var end = self.workQueue().length; 
     end = Math.min(end, start + self.pageSize()); 
     return self.workQueue().slice(start, end); 
    }); 
}; 

var vm = new ViewModel(); 
ko.applyBindings(vm); 

loop(); 

function loop() { 
    if (vm.startPos() + vm.pageSize() < vm.workQueue().length) { 
     vm.startPos(vm.startPos() + 1); 
     window.setTimeout(loop, 10); 
    } 

} 

它只是创建原始数组的辅助切片，而不是原始数组。

但是，如果只能看到部分列表，排序行为会很奇怪？

http://jsfiddle.net/Dzpkx/1/