angular 监听 Windows 滚动事件 实现页面滚动加载

方案一

使用render2的listen方法进行监听，之前这样做，问题是，监听事件触发后，在其他组件中触发window的滚动

 this.renderer2.listen('window', 'scroll', () => {
            console.log('scroll');
        });

方案二

  //监听滚动，加载数据
    @HostListener('window:scroll', ['$event']) public onScroll = ($event) => {

        //客户端高度
        var clientH = document.documentElement.clientHeight;
        //body高度
        var bodyH = document.body.clientHeight;

        //滚动的高度
        var scrollTop = document.documentElement.scrollTop;
        console.log(bodyH)
        //滚动到底部60以内
        if (bodyH - clientH - scrollTop < 80) {
            if (!this.flag) {
                console.log('翻页');
                //翻页
                this.changePage('+');
            }
            this.flag = true;
        } else {
            this.flag = false;
        }
    }

设置flag的目的是避免在滚动的过程中重复加载数据，到达只加载一次的目的

本作品采用《CC 协议》，转载必须注明作者和本文链接