禁用按钮，直到用户向下滚动到页面底部

Question

  

我正在实施测验之类的事情，因此在检阅测验页面的底部有一个检阅页面，有一个名为“开始测验”的按钮。

如何禁用开始测验按钮，直到用户向下滚动到底部并在用户到达底部时启用。

到目前为止，我已经尝试过：

ngOnInit() {
    this.isScrolledToBottom = false;
   window.addEventListener('scroll', this.scrollEvent, true);
}

 scrollEvent = (event: any): void => {
     let bottomPosition = (event.srcElement.scrollTop || document.body.scrollTop) + event.srcElement.offsetHeight;
     let scrolledHeight = event.srcElement.scrollHeight;
     if (bottomPosition >= scrolledHeight) {
       this.isScrolledToBottom = true;
     }
 }


<button mat-raised-button color="accent" type="button" 
          [disabled]="!isScrolledToBottom" (click)="startQuiz()">
    Start Quiz
  </button>

问题是它在中等分辨率的PC上可以正常工作，但在向下滚动无法启用的大屏幕按钮上无法正常工作。 谁能告诉我我在这里做错了吗？