我正在为列表创建一个新项目,并希望在保存后滚动到它。目前它滚动但 5 个项目太短(即我必须手动向下滚动另外 5 个项目才能看到我的项目) 我玩过 setRenderedContentOffset 但这似乎没有什么区别。在滚动到该项目后,我很乐意以编程方式再滚动 500 像素,但我似乎也无法让它工作。
let selectedIndex = this.filteredCompanies.findIndex(item => item.companyId == this.newlyAddedItemId)
this.virtualScrollViewport.setRenderedContentOffset(
500,
'to-end'. // No matter if I use to-start or to-end it seems to have no affect
);
this.virtualScrollViewport.scrollToIndex(selectedIndex)
我怎样才能让它滚动那些额外的 500px?
编辑:
我用过this.virtualScrollViewport.measureScrollOffset('bottom');
,它说视口在底部。
我什至尝试在滚动到索引后使用 vanilla javascript 将其滚动额外的 500 像素,但这也不起作用
var objDiv = document.getElementById("virtualScrollContainer");
objDiv.scrollTop = scrollOffsetTop + 500;
所以我猜我需要锻炼为什么容器的高度不正确并且没有正确计算项目。
编辑2:
因此,经过几个小时之后,最初忽略了这个 SO 答案,因为我想让它按照文档规定的方式工作使用 cdk-virtual-scroll (Angular 8) 滚动到底部
我已经使用超时解决方法两次调用底部,现在它可以工作了。
setTimeout(() => {
this.virtualScrollViewport.scrollTo({
bottom: 0,
behavior: 'auto',
});
}, 0);
setTimeout(() => {
this.virtualScrollViewport.scrollTo({
bottom: 0,
behavior: 'auto',
});
}, 50);