How do I scroll the scrollbar to the bottom?

Question

I'm having problem with scrolling scrollbar to the bottom. It works on load correctly when on ngAfterViewInit.

When I add new message it doesn't trigger the scroll, but after adding the second message, it scrolls to the first message. So it looks like I need an delay or something.

@ViewChild(PerfectScrollbarComponent, {static: true}) scrollbar?: PerfectScrollbarComponent;


scrollToBottom(): void {
    this.scrollbar.directiveRef.scrollToBottom(0, 200);
 }

I created a Stackblitz for that: StackBlitz

Answer 1

Wrap it with setTimeout:

setTimeout(() => {
  this.scrollToBottom();
});