Questions tagged [angular-cdk-virtual-scroll]

81 questions
15
votes
2 answers

Angular virtual scroll: append new items when reaching the end of scroll

I would like to use virtual scroll on my Angular application. The items in my list are the result of a remote paged search. I would like to load more results (call the next page) every time I reach the end of the viewport scrolling down. Here is my…
14
votes
1 answer

How to programmatically scroll to item with angular's material virtual scroll?

I have a list that has many items and each item can be selected. For this I use Angular Material Virtual Scroll. When an item is selected, the selected item is highlighted and then is saved on the server. When I refresh the page, the selected item…
9
votes
2 answers

PrimeNG dropdown with virtual scroll not keeping selection in view

I am making use of the PrimeNG drop down component with custom filtering and virtual scroll enabled. I am finding the component is not scrolling back to the last selection made in the list of items in view when it's re-opened, instead it just…
mindparse
  • 7,083
  • 17
  • 64
  • 146
7
votes
3 answers

Scroll to bottom with cdk-virtual-scroll (Angular 8)

Goal Display a list of messages and scroll to the bottom when a new message is received, even when I am at the top. I would like to scroll fully bottom even with elements of different heights. Problem With virtual scroll, I have to set the…
6
votes
1 answer

Maintain scroll position with CDK autosize virtual scroll strategy

Maintain scroll position with CDK autosize virtual scroll strategy I have a large list of items that can be scrolled with provided by @angular/cdk-experimental (the items have dynamic heights, thus I'm using…
5
votes
1 answer

Obtaining a static component reference within a cdk-virtual-scroller? (References are recycled)

We recently transitioned our scrollable lists to CDK Virtual Scroller. (Angular 7.2.12 with angular/cdk 7.3.7) In short, it seems that the VirtualScrollViewport is recycling component instances, not just the template as the documentation…
msanford
  • 10,127
  • 8
  • 56
  • 83
4
votes
0 answers

scroll not working while pressing navigation up/down button in cdk-virtual-scroll-viewport

I am using cdk-virtual-scroll-viewport in my mat-autocomplete. scroll works fine whenever scroll using mouse but not working whenever pressing keydown button. Expected Behavior: If the focus goes beyond the visible viewport, the list should…
3
votes
1 answer

Angular virtual scroll strategy for different fixed-size items

I'm displaying an infinite, virtual scroll using Angular's cdk-virtual-scroll-viewport. The functionality doesn't rely on anything special from it, besides subscribing for the view position, in order to load new elements when the user scrolls to the…
3
votes
0 answers

Angular material table detect Scroll

I'm using Angular Material Table and want to detect when user scrolls the table. For this, I'm using cdkScrollable. app-my-component: constructor(private scrollDispatcher: ScrollDispatcher)…
2
votes
1 answer

Angular CDKScrollable not firing

I cant seem to get the angular CdkScrollable to fire when creating my own div:
2
votes
1 answer

Virtual Scroll - enabled on condition

I'm working on big data tables and I need to have oportunity to set dynamic if I want to use virtual scroll or standard solution. On my prototype I used *ngIf and duplicated views for standard body and cdk virtual scroll vierport. Is there any…
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

Angular: cdk-virtual-scroll + autocomplete - cdk-overlay-pane issue

I'm using Overlay Module of Angular's CDK with mat-autocomplete. Scenario: There is mat-autocomplete input box with cdk-virtual-scroll and below that there are two buttons. Inputbox is preselected with one of the value from dropdown. Issue: Now if…
2
votes
0 answers

How to use angular virtual scroll with two dimensions?

I'like to use angular virtual scroll on a pivot table that has potentially many rows and many columns, so i'd like to have virtual scrolling both horizontaly and verticaly. Is there a way to do that with angular material sdk or should i write it…
JulienFr
  • 1,792
  • 1
  • 20
  • 29
2
votes
1 answer

CDK Infinite scroll end checking

im trying to implement infinite scroll for loading items on to the list dynamically when user scrolls down the list, but when i access the end and total , it is coming as same, i need to check if the last item is reached and then append new items to…
1
2 3 4 5 6