我也遇到过同样的问题。对于我来说，在一个时间点上，div的元素没有完全加载，scrollTop属性是用scrollHeight的当前值初始化的，这不是scrollHeight的正确结束值。

我的项目在Angular 8中，我所做的是:

我使用viewchild来获取.ts文件中的元素。 我已经继承了AfterViewChecked事件，并在那里放置了一行代码，其中声明viewchild元素必须将scrollTop值的值scrollHeight (this.viewChildElement.nativeElement。scrollTop = this.viewChildElement.nativeElement.scrollHeight;)

AfterViewChecked事件触发了几次，它最终从scrollHeight中获得了正确的值。

如果有人在搜索Angular

你只需要向下滚动添加到你的div

 #scrollMe [scrollTop]="scrollMe.scrollHeight"

   <div class="my-list" #scrollMe [scrollTop]="scrollMe.scrollHeight">
   </div>

香草JS实现:

element.scrollIntoView(false);

https://developer.mozilla.org/en-US/docs/Web/API/element.scrollIntoView

CSS-Only ? !

一个有趣的css替代方案:

display: flex; 
flex-direction: column-reverse;

  /* ...probably usually along with: */

overflow-y: scroll;  /* or hidden or auto */
height: 100px; /* or whatever */

它不是万无一失的，但我发现它在一些情况下很有帮助。

文档:flex, flex-direction, overflow-y

演示:

var i=0, foo='Lorem Ipsum & foo在酒吧或blah !和“。分割(' '); setInterval(函数(){demo.innerHTML + = foo [i + + % foo。长度)+ ' '},200) #{演示显示:flex; flex-direction: column-reverse; overflow-y:滚动; 宽度:150 px; 身高:150 px; 边框:3px纯黑色;｝ 身体{字体类型:arial,无衬线; 字体大小:15 px;｝ Autoscrolling演示:& # x1f43e; < div id =“演示”> < / div >

你可以给link元素的引用属性href附加任何id:

<a href="#myLink" id="myLink">
    Click me
</a>

在上面的例子中，当用户单击页面底部的“点击我”时，导航导航到“点击我”本身。

以下是我的解决方案:

 //**** scroll to bottom if at bottom

 function scrollbottom() {
    if (typeof(scr1)!='undefined') clearTimeout(scr1)   
    var scrollTop = (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop;
    var scrollHeight = (document.documentElement && document.documentElement.scrollHeight) || document.body.scrollHeight;
    if((scrollTop + window.innerHeight) >= scrollHeight-50) window.scrollTo(0,scrollHeight+50)
    scr1=setTimeout(function(){scrollbottom()},200) 
 }
 scr1=setTimeout(function(){scrollbottom()},200)