Javascript 爱奥尼亚3-如何在点击按钮时向下滚动内容？

我正在开发一个离子聊天应用程序。我想在发送文本按钮单击时自动向下滚动内容。你可以在图片中查看这个

这是我的密码：

---

您可以使用一些DOM节点属性，如scrollTop、scrollLeft

例如：

var el = document.querySelector("#chat-window");
el.scrollTop = 0; //this will make window scroll to top (if scroll is there)
el.scrollLeft = 0;

但由于没有像scrollBottom这样的属性，scrollRight。我不知道。因此，您需要有一个帐户，根据内容大小，每次单击按钮需要完成多少scrollTop

el.scrollTop = x; //x is calculated scrollTop value.

你可以将scrollTop设置为无穷大，使其滚动到底部

el.scrollTop = Infinity;

但不建议这样做，在使用Infinity和scroll update的不同浏览器上可能会有一些副作用。最好是完全控制代码，并在需要时更新scrollTop

---

我希望有帮助

首次从ionic angular导入内容

 import { Content } from 'ionic-angular';

通过使用@viewChild注释，您可以在组件页面中获得ion内容引用

 @ViewChild(Content) chatlist : Content

然后在按钮中单击

this.chatlist.scrollToBottom();

---

演示

它显示了一个错误，无法读取未定义的属性'scrollToBottom'。您可以使用我提供的演示链接进行检查吗？是的，我尝试了相同的方法，但仍然显示了相同的错误，无法读取未定义的属性'scrollToBottom'。

this.chatlist.scrollToBottom();