Dynamic viewport height

[Matheo211]

Bug, feature request, or proposal:

Dynamically adjust the size of the table according to its content

What is the expected behavior?

It would be interesting to be able to define only the maxheight of the table and to adjust it dynamically according to the amount of data it contains until it reaches the maxheight. When the size is max height the virtualscrolling is available.

What is the current behavior?

When the cdk-virtual-scroll-viewport has no defined height it does not display all available values. If the height is defined the viewport displays all lines but when it is undefined just a few lines are displayed.

What are the steps to reproduce?

Stackblitz

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

latest cdk-experimental

Is there anything else we should know?

[markkoo]

I have a simple workaround

` cdk-virtual-scroll-viewport { contain: none !important; }

.cdk-virtual-scroll-spacer { position: relative !important; }`

Got any side effect?

[gonzo09]

Same thing happen when the cdk virtual scroll is hide (display:none) by default: Stackblitz (you can change the default behavior by changing the hideCdkVS variable to false in virtual-scroll.component.ts). @markkoo your workaround doesn't work in my case

[thonythony]

Hello, I have same issue. What's the status ?

[angular-robot[bot]]

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

[angular-robot[bot]]

Thank you for submitting your feature request! Looks like during the polling process it didn't collect a sufficient number of votes to move to the next stage.

We want to keep Angular rich and ergonomic and at the same time be mindful about its scope and learning journey. If you think your request could live outside Angular's scope, we'd encourage you to collaborate with the community on publishing it as an open source package.

You can find more details about the feature request process in our documentation.

[caviroskii]

@markkoo with your solution this (transform: translateY(0px); dosen't work

`cdk-virtual-scroll-viewport itemSize="41" minBufferPx="295" maxBufferPx="900"

div class="cdk-virtual-scroll-content-wrapper" style="transform: translateY(0px);"`

when you have container of 500px and you have results of 2000px results are not displayed after maxBufferPx 900px when you scroll.