如何在 Angular 中获取 clientHeight？答案

【问题标题】：How to get clientHeight in Angular?如何在 Angular 中获取 clientHeight？
【发布时间】：2019-06-19 11:19:47
【问题描述】：

我在滚动页面时尝试获取客户端高度：

@HostListener('window:scroll', ['$event']) onScrollEvent($event) {
   if ($event.scrollHeight - $event.scrollTop === $event.clientHeight) {
    console.log('scrolled to the end');
  }
});

我需要检测用户是否滚动到页面末尾

【问题讨论】：

document.documentElement.clientHeight ?

标签： javascript angular

【解决方案1】：

我认为你可以这样做（see this post for other solutions，and this article for this solution）：

@HostListener("window:scroll") onWindowScroll() {
    let scroll = window.pageYOffset ||
                 document.documentElement.scrollTop ||
                 document.body.scrollTop || 0;

    const max = document.documentElement.scrollHeight -
                document.documentElement.clientHeight;

    if (scroll === max) {
        alert('Bottom');
    }
}

见Stackblitz demo here

【讨论】：

【解决方案2】：

获取高度：

 var height = $window.innerHeight;

【讨论】：

我点使用 JQUERY
这不是使用 jQuery。 $window 是 angular 的一部分。因此，您应该将滚动高度与窗口高度进行比较。
好的，那么如何替换这段代码：if ($event.scrollHeight - $event.scrollTop === $event.clientHeight) { console.log('scrolled to the end'); }?
我需要检测用户是否滚动到页面末尾
if ($window.scrollY + $window.innerHeight >= document.body.scrollHeight) { // 页面结束 }