angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.35k stars 6.74k forks source link

We're moving away from positioning the dropdown on top of the select. You can try our new select based on top of MDC's styles. The API and behavior is exactly the same since it shares the same base class as the current select, but the CSS will be slightly different and the dropdown is only positioned above/below. You can try it by importing `MatSelectModule` from `@angular/material-experimental/mdc-select` instead of `@angular/material/select`. #24229

Closed khepf closed 2 years ago

khepf commented 2 years ago

Hello,

Any update on when the corrections to the mat-select dropdown positioning might be ready for production? I have a few teams holding off on updating from Angular Material 11 for this reason alone.

Thank you! Jeremy

We're moving away from positioning the dropdown on top of the select. You can try our new select based on top of MDC's styles. The API and behavior is exactly the same since it shares the same base class as the current select, but the CSS will be slightly different and the dropdown is only positioned above/below. You can try it by importing MatSelectModule from @angular/material-experimental/mdc-select instead of @angular/material/select.

Originally posted by @crisbeto in https://github.com/angular/components/issues/23625#issuecomment-931448386

crisbeto commented 2 years ago

The component in material-experimental should be usable as it is right now. As I mentioned, it inherits all of its logic from the existing mat-select, except for the dropdown positioning and CSS styles. I can't say when it'll be made the default, because we are blocked on some external dependencies, but when that happens, we'll have an automated migration to change your import back to @angular/material/select.

Splaktar commented 2 years ago

Please submit Angular Material and CDK questions here and issues here. This repo is for AngularJS Material.

I have transferred this issue to the correct repository for you.

khepf commented 2 years ago

13.1.1 I thought I would try out the experimental mat-select version but I am getting quite a few errors.

First of all, npm install @material/line-ripple needs to be installed, per the first build error. Then it build successfully. But when I start it, I am getting: Error: Module not found: Error: Can't resolve '@material/textfield' Error: Module not found: Error: Can't resolve '@material/dom' Error: Module not found: Error: Can't resolve '@material/notched-outline'

I had a look at some old Angular 11 builds and these modules were not located there either.

I am not finding any answers for these errors when I search for them.

crisbeto commented 2 years ago

You can install this instead which brings in all of the MDC code. https://www.npmjs.com/package/material-components-web

Also note that you'll have to include the theme for the MDC select. There's more info here: https://github.com/angular/components/blob/master/src/material-experimental/mdc-select/README.md

angular-automatic-lock-bot[bot] commented 2 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.