angular监听页面滚动
/ 文档对象(document)的根元素卷去的高。// 网页被卷去的高。window可换为指定元素;
·
方法一:
this.scroll = fromEvent(window, 'scroll').subscribe(e=>{
console.log('页面滚动了');
})
window可换为指定元素;
方法二:
@HostListener('window:scroll')
onscroll(){
console.log('页面滚动了');
}
返回顶部:
window.scrollTo(0,0)
document.documentElement.scrollTop = 0;// 文档对象(document)的根元素卷去的高
document.body.scrollTop = 0;// 网页被卷去的高
//监听滚动,加载数据
@HostListener('window:scroll', ['$event'])
public onScroll = ($event) => {
//客户端高度
var clientH = document.documentElement.clientHeight;
//body高度
var bodyH = document.body.clientHeight;
//滚动的高度
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
//滚动到底部60以内
if (bodyH - clientH - scrollTop < 80) {
if (!this.flag) {
//翻页
this.changePage('+');
}
this.flag = true;
} else {
this.flag = false;
}
}
设置flag的目的是避免在滚动的过程中重复加载数据,到达只加载一次的目的
更多推荐
已为社区贡献1条内容
所有评论(0)