Questions tagged [angular-cdk-virtual-scroll]
116 questions
0
votes
1 answer
Height and width in Percentage is not working for cdk-virtual-scroll-viewport
I have a cdk-virtual-scroll-viewport in my application where height and width are provided in percentage.
...
.wrapper {
height: 100%;
width:…
Kugesh Rajasekaran
- 127
- 2
- 9
0
votes
2 answers
CDK Virtual Scroll for Angular Material Table not working
I have an angular material table that has millions of records, I have added pagination which has options like 10, 25, 50, 100, 500, and 1000, and the max length of the records, which I select 1000 or max records option, there's a delay in the change…
Shinchan
- 81
- 2
- 17
0
votes
1 answer
Angular Material Virtual Scroll height not adjusting correctly
I have a virtual scroll element within an Angular Material Sidenav but it seems this causes the virtual scroll to render incorrectly. I suspect that because the scroll is created "off screen" it does not know the final height? I have tried…
Mad Eddie
- 943
- 3
- 12
- 23
0
votes
1 answer
Primeng table virtual scroll header jumping while scrolling up
I have a large set of data that needs virtual scrolling and I use PrimeNg v13.4.0 with angular/cdk v13.3.7. I have exactly the same issue with PrimeNg demo. When scrolling down, the sticky header works well, but when scrolling up, it start jumping,…
Hoàng Nguyễn
- 1,121
- 3
- 33
- 57
0
votes
1 answer
how to make cdk virtual scroll render items of the table
I'm using CDK VIRTUAL SCROLL in a table that loads a service (API) that returns me a list, with this list I can remove or return their columns respectively as well as their items, but when I remove all columns from the table and requested to return,…
user14160660
0
votes
0 answers
Need to Call API when the user scrolls to the end of the list to load next batch of data using Angular CDK Virtual scroll
I am using below logic to determine if User is at the end of the List. However in the Below case end === total multiple times which is triggering multiple API calls. In actual end and total should be equal only once when the user is at the end of…
Nishit
- 61
- 1
- 8
0
votes
1 answer
How to fit non-list items into virtual scroll using Angular Material CDK
I am currently trying to understand the concepts of virtual scrolling and for that I extensively used the Angular documentation on Angular's CDK. I found out that they implemented virtual scrolling but they do not show how to implement a list on a…
zettee
- 127
- 1
- 2
- 10
0
votes
1 answer
How to track the scroll event of individual cdk-virtual-scroll-viewport
I am using cdk-virtual-scroll-viewport to build pagination scroll in my app. I have two instances of cdk-virtual-scroll-viewport, Want to track individual scroll events and make API call for the individual scrolls. How to achieve that?
Stackblitz…
Rohit Mehrotra
- 29
- 6
0
votes
0 answers
Angular cdk-virtual-scroll-viewport not working
I have a component with cdk-virtual-scroll-viewport which displays cards
scrolling.component.html
qwfrjk
- 71
- 2
- 10
0
votes
0 answers
mat-nav-list inside cdk-virtual-scroll-viewport not getting updated with the HTTP data
I am getting list of "incident_ids" from a HTTP get call as shown in the ts file and populating in the HTML in the mat-nav-list. Problem is mat-nav-list inside cdk-virtual-scroll-viewport not getting updated with the HTTP data but when I remove…
kethan bravo
- 93
- 2
- 6
0
votes
1 answer
Angular cdk-virtual-scroll-viewport return 0 when calling getBoundingClientRect
I have a table component which is contained inside cdk-virtual-scroll-viewport. One of the column cell contains
'..more'
option that expands the entire row. But when scrolled up/down the row collapses due to the nature of scroll-viewport(user…
Raajkumar
- 857
- 2
- 13
- 26
0
votes
2 answers
CdkVirtualFor does not render anything
I am trying to use cdk-virtual-viewpoint in my chat application. Sadly, it doesn't render anything. When I try to use the normal "ngfor" it works fine. But when I use cdkVirtualfor it does not display anything. Please refer to the code below for…
Needyboy
- 41
- 9
0
votes
0 answers
Angular virtual scrolling
We are using Angular 10.0.9. and I just tried to add virtual scrolling to a page and followed the official documentation:
Import ScrollingModule in app.module.ts
Add the cdk-virtual-scroll-viewport with an itemSize and add a *cdkVirtualFor to…
Sebastian S.
- 1,173
- 3
- 13
- 22
0
votes
1 answer
Set width dynamically to 100% of content with CDK Virtual Scroll [Angular Material]
I try to implement a Sidenav that contains a list of Angular Material Expansion Panels. When I'm using the ngFor-directive the layout looks fine, just as I want it. As you can see in the image, it expands the view to 100% of the width of the…
user16192538
- 11
- 3
0
votes
2 answers
Angular CDK virtual scrolling issue
Having issue to render huge list by using Angular CDK virtual scrolling.
Need set the itemsize to 1 to load the list properly.
Expected to load the list according to viewport size.
But it load far far more than the viewport size.
which the viewport…
Dodo
- 103
- 2
- 8