0

I have a table rendered using angular material virtual scroll.

this.trs = [  ...batch, ...this.trs];
setTimeout(() => this.viewPort.scrollToIndex(100), 1000);

I get the data and populated the virtual scroll and then set the scrollToIndex to 100. and the 100th row shows up on the screen.

The problem here is that there is jumping, initially when the scroll loads it loads the 1st row and then jumps to the 100th row. Is there a way to default it to the 100th row. So that it shows up directly without jumping.

More insight into the problem,

This is a bidirectional scroll, when the scrollbar hits the top it calls API and get new values and append on top of the array and then it hits bottom appends data to the bottom.

The logic works well when the data is appended at the bottom, but it scrollbar jumps every time the data is appended on top.

OR https://stackblitz.com/edit/angular-4cwieu?file=src%2Fapp%2Fapp.component.ts

Is it possible to scroll to a particular index without that settimeout?

harikrish
  • 1,933
  • 2
  • 18
  • 32
  • Are you sure you're not populating and then in another tick do the scrolling ? – Ploppy May 01 '20 at 13:08
  • So basically I append data to the object and in a settimeout call the scrollToIndex, If i don't use settimeout, it will be called before the data is loaded. Sorry not sure if i completely answered your question. So i get first row in the screen and then the desired row. – harikrish May 01 '20 at 13:16
  • Yeah I know what your are facing, I don't think there is a solution, I've seen somewhere that you shouldn't use the `settimeout` trick but wait for the ngZone to stabilize. – Ploppy May 01 '20 at 13:20
  • https://stackblitz.com/edit/angular-4cwieu?file=src%2Fapp%2Fapp.component.ts In this example is it possible to set the scrolltoIndex without to the setTimeout – harikrish May 01 '20 at 13:20
  • Ok then do it in the same tick ! – Ploppy May 01 '20 at 13:26
  • because of this, I get a jumping behavior when I scroll up. I can't believe that I can't set a default offset when it loads. – harikrish May 01 '20 at 13:31

0 Answers0