I am working on a chat application. When app starts, it loads few previous chat history messages.
The network call populates the messages variable with history messages and using *ngFor() it gets rendered on page.
As soon as rendering gets completed, view scrolls down to latest/last message with help of
ngAfterViewChecked(). Logic is exactly same as the OR part fo this answer.
Problem - In some low-performance mobile devices, sometimes the initial auto-scroll scrolls 50-70px less than full height.
I increased the delay time to
this.scrollToBottom(400) instead of
300ms(default). That slightly reduced the possibility of this issue but doesn’t completely removes it.
Requirement - How can I make sure to scroll the view to complete bottom? Or would I have to use Angular’s
variable change detector?