我正在开发一个angularJS项目,我遇到了实现ng-handsontable延迟加载功能的要求。数据量巨大,如果允许一次显示所有内容将使网站变得非常慢。 有没有办法为angularJS的ng-handsontable实现延迟加载功能。
我尝试使用纯javascript来实现它,但不适用于angularjs。
Html代码是:
<div id="example1" class="hot handsontable htRowHeaders htColumnHeaders">
</div>
Javascript代码是:
document.addEventListener("DOMContentLoaded", function() {
// mock service for getting data
var fetchData = function(n) {
return Handsontable.helper.createSpreadsheetData(n, 3);
};
// variables
var example = document.getElementById('example1');
var hot;
var data = fetchData(100);
var compute_window = function(e) {
var rowCount = hot.countRows();
var rowOffset = hot.rowOffset();
var visibleRows = hot.countVisibleRows();
var lastRow = rowOffset + (visibleRows * 1);
var lastVisibleRow = rowOffset + visibleRows + (visibleRows/2);
var threshold = 15;
if(lastVisibleRow > (rowCount - threshold)) {
loadMoreData(rowCount);
}
};
// initialize HOT
hot = new Handsontable(example,{
data: data,
rowHeaders: true,
colHeaders: true,
afterScrollVertically: compute_window
});
// load data and render
var loadMoreData = function(n) {
// call data service
var incoming = fetchData(n);
incoming.forEach(function(d) {
data.push(d);
});
hot.render();
};
});
任何人都请帮忙。 感谢