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/