bug(mat-select): Select with many options and custom max-height in wrong position when control is close to bottom of screen

angular / components

Component infrastructure and Material Design components for Angular

https://material.angular.io

MIT License

24.32k stars 6.72k forks source link

bug(mat-select): Select with many options and custom max-height in wrong position when control is close to bottom of screen #22633

Closed thanjnr closed 3 years ago

thanjnr commented 3 years ago

Reproduction

mat-select-bug

Use StackBlitz to reproduce your issue:

Components: https://stackblitz.com/edit/angularmaterial-select-bug?file=src%2Fapp%2Fselect-form-example.html

Steps to reproduce:

Open stackblitz link above
Select last option of dropdown
Click on select again

Expected Behavior

Would expect dropdown to stay next to select input field

Actual Behavior

Dropdown is positioned away from select input field

Environment

Angular: ^11.0.0
CDK/Material: ^11.0.0
Browser(s): Chrome

crisbeto commented 3 years ago

The current select doesn't support changing the max-height, because the code is making some assumptions about it. We have an updated version coming up that will support it, but it's still experimental. If you want to try it out, you can import MatSelectModule from @angular/material-experimnetal/mdc-select instead of @angular/material/select.

angular-automatic-lock-bot[bot] commented 3 years ago

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}