angular监听页面滚动

方法一:

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的目的是避免在滚动的过程中重复加载数据,到达只加载一次的目的

你可能感兴趣的:(angular.js,javascript,前端)