angular / angular/components

feat(virtual-scroll): Allow non fixed-sized containers

Open
#19,875 4 comments 3 reactions 0 assignees View on GitHub
area: cdk/scrolling feature P3
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

#### Feature Description
When using virtual scroll the element needs to have a set height, or else, by default it'll be 0. It would be really useful for it to be able to have an automatic height.

#### Use Case
For example, i've got a page with aprox. 37 accordions, each with something between 5 and 15 mat-buttons inside each. When opening one, the opening animation is choppy because of how many are rendered on screen (this bug has already been reported in #8287).
I think this can be mitigated in this use case by only rendering what's visible with a virtual-scroll, but, because the height is dynamic(as, when an accordion needs to open, the size of the containing element changes), i cant give it a specific height, thus i can' use

Contributor guide

Open the contributing guide

Research direction

Start by examining the cdk-virtual-scroll-viewport behavior described in the issue and the related performance context in #8287. Determine how a viewport without a fixed height should respond when accordion content expands; done means dynamic-height containers can use virtual scrolling without choppy opening animations.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.