Javascript 聊天类型-滚动至底部-角度2

在聊天中添加消息后，需要自动滚动至底部

尝试了AfterViewChecked实现此功能的方法，如中列出的建议 [-它可以很好地工作，因为它会使滚动移动到底部。但是当我们在聊天中添加消息后尝试向上滚动时，它是不允许的，并且它会再次将视图推到聊天的底部

---

请建议解决方法。

以下代码适用于我的angular 4聊天应用程序

My

component.html

<div class="feedBody"  #scrollMe (scroll)="onScroll()" >
  <div class="feedList">
  </div>
</div>

我的

组件.ts

scrollToBottom():void{
    if (this.disableScrollDown) {
      return
    }
    try {
      this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
    } catch(err) { } 
  }
onScroll(){
    let element = this.myScrollContainer.nativeElement;
    let atBottom = (element.scrollTop+200) >= (element.scrollHeight - element.offsetHeight);
    if (atBottom) {
        this.disableScrollDown = false
    } else {
        this.disableScrollDown = true
    }
  }

我使用的是

element.scrollTop+200

，因为我想要的是一种行为，我不应该强制出现在屏幕的底部，但可以在200px前稍微处于顶部

希望它对您有用。

试试这个：

scrollToBottom():void{
    if (this.disableScrollDown) {
      return
    }
    try {
      this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
    } catch(err) { } 
  }
onScroll(){
    let element = this.myScrollContainer.nativeElement;
    let atBottom = (element.scrollTop+200) >= (element.scrollHeight - element.offsetHeight);
    if (atBottom) {
        this.disableScrollDown = false
    } else {
        this.disableScrollDown = true
    }
  }