Questions tagged [virtualscroll]

A UI technique dedicated to increase the performance of large scrollable lists by rendering only a small portion of the data at a moment and virtualising other parts of the dataset, so that the scrollbar parameters remain consistent and a user experiences the result interface close to the original one (without virtualisation)

enter image description here

130 questions
2
votes
1 answer

Setting dynamic height for Angular CDK virtual scroll viewport

I'm working on Angular table with usage of cdk Virtual Scroll. Do you know if there is any way to set the dynamic height of scroll viewport? Everything works fine with standard style property but I can't set the value using ngStyle. I would be…
2
votes
1 answer

ui-scroll for long text virtualising

What is the best way of showing a very long text (in MBs) using ui-scroll ? The text is available in the form of an array but needs to be displayed as a long text document just like a textarea. I'm using ui-scroll as each word in the text is a…
user4848830
  • 779
  • 12
  • 22
2
votes
2 answers

Angular Material Scroll loads more items than expected

I am trying to load 20 items through the virtual scroll component, but I see 34 as soon as the page loads, without doing any scrolling at all. Have I got the css wrong? Or there is some setting on the control that I forgot? The project is located…
2
votes
1 answer

virtual scroll for angular not adding data to list

I've tried implementing infinite virtual scroll on Angular 7 project with Hasura's GraphQL backend. I'm unable to figure out why the new data is not added and why there are multiple API requests when I scroll. Here's the component,…
2
votes
1 answer

Angular Virtual Scroll works fine on browser but fails Jasmine test on initialization

I tried to incorporate Angular Virtual inside one of my component and it works fine as intended on browser. However, when I try to write the test case for the same, the Karma runner throws the following set of error while initializing the…
Laxminarayan
  • 74
  • 1
  • 6
2
votes
1 answer

Angular 7 - virtual scroll combined with async subscription

I am using async in my Angular 7 project to automatically subscribe my data I want to display. The data is displayed as a table with about 2000 items. The following code is from my template:
student18
  • 538
  • 8
  • 26
2
votes
1 answer

Adding item at top of a list using Angular UI-Scroll

I am using Angular UI scroll. The example I am following is this one . It has a demo page here. It has a function to add a list item at specific position. Following is the excerpt of the code: $scope.addToList1 = -> …
van
  • 633
  • 14
  • 26
1
vote
0 answers

How to apply list virtualization using React window when infinite scroll is implemented using React-Query

I am making a news app and I have implemented infinite scroll using React Query. But my cocern was as more and more dom elements get added to the dom because of infinite scroll the dom gets heavy . To solve this I wanted to implement List…
1
vote
0 answers

Expansion panel inside dynamic scroller (vue-virtual-scroller)

I want to render a list of components using the DynamicScroller in the vue-virtual-scroller package. This is my template: