javascript - 聊天类型-滚动到底部- Angular 2

在聊天室中添加信息后，需要自动滚动至底部。
尝试了AfterViewChecked方法来实现此功能，如中所述
[angular2 scroll to bottom (chat style)-它可以让滚动条移动到底部。但是当我们尝试在聊天室中添加一条消息后向上滚动时，它不允许，并且再次将视图推到聊天室的底部
请建议解决这个问题。

最佳答案

下面的代码适用于我的Angular4聊天应用程序
我的component.html

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

我的component.css

.feedBody {
  height: 235px;
  overflow-y: auto;
}

我的component.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是因为我想要一种行为，即我不应该强制出现在屏幕底部，而是可以在200像素的时候出现在顶部。
希望对你有用。

关于javascript - 聊天类型-滚动到底部- Angular 2，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44870707/