md2/select/select.html

Angular2 based Material Design components, directives and services are Accordion, Autocomplete, Chips(Tags), Collapse, Colorpicker, Data Table, Datepicker, Dialog(Modal), Menu, Multiselect, Select, Tabs, Tags(Chips), Toast and Tooltip.

<div class="md2-select-trigger" cdk-overlay-origin (click)="toggle()" #origin="cdkOverlayOrigin" #trigger><span class="md2-select-placeholder" [class.md2-floating-placeholder]="_selectionModel.hasValue()" [@transformPlaceholder]="_getPlaceholderAnimationState()" [style.opacity]="_getPlaceholderOpacity()" [style.width.px]="_selectedValueWidth">{{ placeholder }}</span> <span class="md2-select-value" *ngIf="_selectionModel.hasValue()"><span class="md2-select-value-text">{{ triggerValue }}</span> </span><span class="md2-select-arrow"></span> <span class="md2-select-underline"></span></div><ng-template cdk-connected-overlay [origin]="origin" [open]="panelOpen" hasBackdrop (backdropClick)="close()" backdropClass="cdk-overlay-transparent-backdrop" [positions]="_positions" [minWidth]="_triggerWidth" [offsetY]="_offsetY" (attach)="_onAttached()" (detach)="close()"><div class="md2-select-panel" [@transformPanel]="'showing'" (@transformPanel.done)="_onPanelDone()" (keydown)="_keyManager.onKeydown($event)" [style.transformOrigin]="_transformOrigin" [class.md2-select-panel-done-animating]="_panelDoneAnimating"><div class="md2-select-content" [@fadeInContent]="'showing'" (@fadeInContent.done)="_onFadeInDone()"><ng-content select="md2-select-header"></ng-content><ng-content></ng-content></div></div></ng-template>