Angular8滚动到底部Safari 12不起作用

Question

我有这样的代码，当到达页面底部时，它将检测滚动。

@HostListener('window:scroll', [])
onScroll(): void {
if (window.innerHeight + window.scrollY === document.body.scrollHeight) {
document.querySelector('.button').classList.add('sticky-bottom-margin');
console.log("Bottom");
} 
}

我的页面下面有一个粘性按钮；粘性底部边缘"；类将有一个CSS底部边距值，这样当到达底部页面时，页脚将不会被覆盖或隐藏。然而，当我在Ipad Mini 2019 safari 12中尝试这个时。它不起作用。请告知。感谢

Answer 1

我解决了这个问题。而不是使用document.querySelector('.button'(.classList.add('sicky-bottom-margin'(在我的粘性按钮上添加一个类。如果页面到达页面底部，我只添加了一个布尔变量，一旦布尔值为true，我就会在html中的粘性按钮上添加一个类。

HTML:

<div class="sticky-save-button" [class.sticky-bottom-margin]="bottomScroll">
<button mat-button class="btn-primary"> Save </button>
</div>

TS:

@HostListener('window:scroll', [])
onScroll(): void {
this.bottomScroll = false;
if (window.innerHeight + window.scrollY >= document.body.scrollHeight) {
this.bottomScroll = true;
}
this.cdr.detectChanges();
}

谢谢！