How to infinite-scroll with distance from top instead of bottom (good for chat scroll history)

tutorials
8

I’m also looking for a smoother solution to this. I need to keep the scrolling position stay in the same location after adding items on top the list.
As @cquartier described, I’m using same temporary solution which is not completely satisfactory but works :

if (scroller.getScrollPosition().top <= 20) { //  larger the value results in more jerky list
    lastScrollHeight = document.getElementById('full-message-list').scrollHeight;	                
       pullPreviousMessages();
       $timeout(function(){ // adding some delay to load the scroller with new items
           var currentScrollHeight = document.getElementById('full-message-list').scrollHeight;
           var lastPostion = currentScrollHeight - lastScrollHeight;
           scroller.scrollTo(0, lastPostion, false);
       }, 300);                                    
}

Also, the above function is attached to the scroller element using following code :

<ion-content id="full-message-list" delegate-handle="full-message-list" on-scroll="onMesaageScroll()" scroll-event-interval="50">
1 Like