Mat Autocomplete Selected Event

If i have a selected value and change the value the onselectionchange will fire two events.

Mat autocomplete selected event.

Now it s possible to recognize when the item is selected or deselected. Angular material select provides selectionchange event that emits when the selected value has been changed by the user. On blur of the input validate function is called to check if the user wrote a valid value without selecting it in the list. One with isuserinput true and one with false.

Now it s possible to recognize when the item is selected or deselected. However after a selection has been made the selected item is the only item available in the autocomplete drop down no matter what changes i make. I am using an autocomplete mat autocomplete and at the moment it allows loading a list of users. In autocomplete i want to display the username but i want to save the value of that chosen user id.

This allfruits val map user user username. After selection from drop down to show selected value a property of that object and not the complete object in text input we need to use displaywith property of mat autocomplete element to bind a function that will return display value for text input and we will bind complete object to mat option element so that we can get complete object. The onselectionchange event replaced the selected event. So even if i delete all the text in the input i still only see the previously selected option.

Both will fire soap request and the last soap request is the previous selected value isuserinput false. The autocomplete is a functionality which shows the recommended options to the user when the user clicks on the input field or enters some keywords in an input field. Using mat autocomplete of material2. Bug feature request or proposal.

The event selectionchange is used with mat select element as following.