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
3
votes
2 answers

Adjust height of dropdown menu Angular7 autocomplete with virtual-scroll

I'm using angular-material Autocomplete (version 7) for my application. I'm using inside . Besides numerious problems I've resolved, there is one I don't understand: the dropdown menu doesn't display when I add…
Hailan
  • 43
  • 1
  • 6
3
votes
1 answer

Angular 7 cdk-virtual-scroll-viewport - virtual scroll

Is there any event available with, cdk-virtual-scroll-viewport to find the element in the list is rendered or not. for example while scrolling through a list of like below, is there a way to identify a particular li is rendered or not or a set of…
Shyam Mohan
  • 119
  • 2
  • 7
3
votes
2 answers

How to make PrimeNg VirtualScroller responsive height?

I have a primeng VirtualScroller and it has a property scrollHeight that fixes some height. I've tried to set 100% at value but it doesn't accept. Also tried to add style or class to component to set height 100% but does not work aswell. How can I…
3
votes
1 answer

How to persist state of Svelte components in a virtual list?

I'm developing a gantt chart component in Svelte and it consists of 100s of row components each containing multiple task components each. Tasks can be dragged and moved. Performance is a priority and I am using a virtual list to render only the…
Ante Novokmet
  • 388
  • 3
  • 13
3
votes
0 answers

Angular 2 kendo grid virtual scroll paging not working properly while drag and drop scroll bar

I am working on a demo for virtual scroll with kendo grid. I am using remote data(API call from service). When I drag and drop my scroll bar to bottom of the grid then last page data (Here pagesize = 50 so last 50 data) should be display. But this…
Aarsh
  • 2,555
  • 1
  • 14
  • 32
3
votes
3 answers

Virtual scroll for Angular 2+

Hi there! I am in need to create a table with so many records using Angular 2+. For that, I'm trying virtual scroll. Still, I can't find any documentation or samples in a working condition. Please help me for getting started with Angular 2+ virtual…
Navaneethan
  • 1,029
  • 1
  • 9
  • 15
3
votes
2 answers

How can I use "ui-scroll" with my own data?

I'm trying to create a infinite scroll feature in my application but it feels a bit abstract. I want to use ui-scroll and this fiddle shows a simple example of how it works. I've read the readme and looked through some examples also I've integrated…
Peter Boomsma
  • 8,851
  • 16
  • 93
  • 185
3
votes
1 answer

Filtering Angular-ui Scroll

I am trying to implement infinity type scrolling on a simple grid. Html is like this:

Customer List


Search:
John
  • 505
  • 1
  • 9
  • 22
2
votes
1 answer

PrimeNG table with virtualScroll not showing border around rows properly

I am using PrimeNG table with virtualScroll like so
ILIA BROUDNO
  • 1,539
  • 17
  • 24
2
votes
0 answers

How to add virtual scrolling to an ant design table with custom components?

I am looking for a way to add virtual scrolling to my ant design table. I found some libaries to achieve that (virtualized-table-for-antd, antd-virtualized, ...), but they seams be no longer under development and they also do not offer a possibility…
Luxaaa
  • 119
  • 1
  • 4
2
votes
1 answer

How to lazy load angular stand alone components with Virtual scrolling?

I need help understanding how to use
Benjamin McFerren
  • 822
  • 5
  • 21
  • 36
2
votes
0 answers

Angular - Horizontal virtual scrolling with multiple columns

I would like to build the attached functionality, where I have around 20k items. I have tried mat cdk virtual scroller, but it is not working as it provides a single column with a horizontal scroll. Note: Boxes in the design represent…
2
votes
0 answers

Use Angular Virtual Scrolling with a ui5-table web component having a sticky header

When I use Angular Virtual Scrolling with a ui5-table web component having the sticky-column-header flag set to true the column headers move to the bottom when scrolling down (randomly jumping between). In my setup I use 100 entries and 3 columns…
FelixD
  • 75
  • 7
2
votes
1 answer

Angular Virtual scroll performance issue on overriding scrollbar styles

I'm using cdk-virtual-scroll-viewport to apply virtual scrolling. Unfortunately, after applying styles to the scrollbar, scrolling is not smooth anymore. The native (right side) scrollbar is flashing but it's moving smoother. Tested on…
N Fard
  • 1,063
  • 1
  • 15
  • 33
2
votes
1 answer

Angular ng-select virtual scroll functionality

My page consists of several ng-select (Custom server-side search) dropdowns created by a *ngFor directive, having the possibility to pick multiple items from each dropdown. I also want to include the virtual scroll functionality but I don't know how…
shAkur
  • 944
  • 2
  • 21
  • 45
1 2
3
8 9