Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to control md-select drop down position in Angular Material

I need to customize a md-select so that the option list acts more like a traditional select. The options should show up below the select element instead of hovering over top of the element. Does anyone know of something like this that exists, or how to accomplish this?

like image 710
Scott Bonner Avatar asked Sep 16 '16 19:09

Scott Bonner


1 Answers

This applies to Material for Angular 2+

Use disableOptionCentering option, such as:

<mat-select disableOptionCentering>
  <mat-option *ngFor="let movie of movies" [value]="movie.value">
    {{ movie.viewValue }}
  </mat-option>
</mat-select>
like image 184
stack247 Avatar answered Oct 02 '22 17:10

stack247