virtualscroll

virtual scroll on Angular 7 is not visible - the height is zero by default

走远了吗. 提交于 2019-12-01 16:53:58
问题 Scenario: Tried a basic virtual scroll test reading this blog post the array had lots of items there was no error the list loaded in a virtual scroll but the height of it was 0 by default quick fix was to set the height for cdk-virtual-scroll-viewport to 500px or set the height for class 'example-viewport' in app.component.css Question : what is the proper way to overcome this zero height? sample at https://stackblitz.com/edit/angular-efdcyc 回答1: use min-height of 100% for the viewport and

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

被刻印的时光 ゝ 提交于 2019-12-01 04:02:51
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 comes from the server and is again highlighted. My code looks like <cdk-virtual-scroll-viewport itemSize="40" class="wrapper"> <div *cdkVirtualFor="let item of list" [class.selected]="item.id === selectedItem.id"> </div> </cdk-virtual-scroll-viewport> The problem is that if a select an item that is down in the list, it is highlighted, but I have to

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

假装没事ソ 提交于 2019-12-01 01:37:19
问题 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 comes from the server and is again highlighted. My code looks like <cdk-virtual-scroll-viewport itemSize="40" class="wrapper"> <div *cdkVirtualFor="let item of list" [class.selected]="item.id === selectedItem.id"> </div> </cdk-virtual-scroll