I am using md-autocomplete in conjunction with a series of items in an md-radio-group. On the left side of the UI the user can select a radio button. When this is selected data for that item existing data is loaded into the right hand side of the screen.
One of the items on the right hand side of the screen is an md-autocomplete. It is working great for manual data entry when the "New Item" radio button is selected.
However when the user selects an existing item I cannot figure out how to fully load and initialize the md-autocomplete programmatically.
The md-autocomplete looks something like this:
md-items="option in controller.getOptions(myObject.planSearchText)"
md-search-text="myObject.searchText"
md-search-text-change=""
md-selected-item="myObject.subObject.item"
md-selected-item-change="myObject.itemSelected(option)"
placeholder="Option Name"
When I click a radio button I programmatically set myObject.subObject.item. This has no visible to the user effects on the md-autocomplete. So I tried immediately after also setting myObject.searchText. This does have a visible effect in that it populates the input with the desired text. However it has the undesirable side effect of opening the popup menu with any matches preventing the user from doing anything else until they mouse over the open menu to close it. Is there a way to programmatically set the value of md-autocomplete with the proper object and the value of the associated input with the proper text after initialization? If so I'm not finding documentation on it.
I should note this is version 0.10.0
Related: #3865
I'm having the same issue, trying to make related autocompletes. I have a global version that updates other autocompletes on the form, but trying to set md-selected-item does nothing visibly, and as noted above setting md-search-text makes the select modal appear.
Related: #3084
I'm curious why this was closed? As described in #3084, the current way to clear the selection is setting both md-search-text and md-selected-item to null. With md-min-length="0", this results in the dropdown re-opening and re-focusing immediately after selection. The only way we've found to avoid this is to disable the autocomplete using ngDisabled, clear the input as described above, and then renable (in a $timeout). Definitely not an ideal solution.
I was able to solve this by accessing the mdautocontroller programatically and calling blur on it like this:
$scope.$$childHead.$mdAutocompleteCtrl.blur()
delete $scope.selectedItem;
$scope.searchText = "";
Most helpful comment
I'm curious why this was closed? As described in #3084, the current way to clear the selection is setting both
md-search-textandmd-selected-itemtonull. Withmd-min-length="0", this results in the dropdown re-opening and re-focusing immediately after selection. The only way we've found to avoid this is to disable the autocomplete usingngDisabled, clear the input as described above, and then renable (in a$timeout). Definitely not an ideal solution.