md-autocomplete

I want to call a function when an option is selected. After some search it seem that i have to use : property optionSelections of MdAutocompleteTrigger In the documentation : https://material.angular.io/components/component/autocomplete optionSelections Stream of autocomplete option selections. I dont understand that , what is a stream, how to implement this ? On md-option you can set "onSelect" <md-autocomplete #auto="mdAutocomplete"> <md-option (onSelect)="callSomeFunction()" *ngFor="let state of states" [value]="state.name">{{ state.name }}</md-option> </md-autocomplete> Since beta 3,

I'm using md-autocomplete from Angular Material: here It seems the dropdown's width goes with the input field's width. If an item's text is too long, there is ellipsis . However, I want to show full text of an item, while keeping the input field's width relatively short. That is, the dropdown's width should expand with its content. I tried inspecting the styles of md-autocomplete 's elements, but couldn't find any style that does the trick. Any idea? EDIT: Here are the style I ended up having: .md-autocomplete-suggestions-container{ overflow-y:scroll } .md-autocomplete-suggestions-container

I'm using Angular Material for Angular 4 (4.3.4) and I need to hook into the selection event to clear the input and store the object in a separate list. But there's a problem: the onSelectChange output ALWAYS gets the first item as the parameter! What's going on? Here's my template: <md-autocomplete [displayWith]="displayRole" #auto="mdAutocomplete"> <md-option *ngFor="let role of roles | acrole: roleField.value | slice:0:4; let i=index;" [value]="role" (onSelectionChange)="AddRole(role)" > <div class="label"> {{role.label}} </div> </md-option> </md-autocomplete> And here's my AddRole function