how to hide dropdown md-autocomplete - angularjs

Question

How to Hide AutoComplete Dropdown after selected item i try many types but not success , anyone help me this , highly appreciated
<md-autocomplete id="autocomplete" st-search="campaign_name"
ng-disabled="Ctrlmain.isDisabled"
md-no-cache="true"
md-selected-item="Ctrlmain.selectedItem"
md-search-text="Ctrlmain.campaignname"
md-selected-item-change="Ctrlmain.filltextbox(item)"
md-items="item in Ctrlmain.getMatches(Ctrlmain.campaignname) | unique:'campaign_name'"
md-item-text="item.campaign_name"
md-min-length="0"
placeholder="Search Campaign"
md-menu-class="autocomplete-custom-template">
<md-item-template>
<span class="item-title">
<span> {{item.campaign_name}} </span>
</span>
</md-item-template>
</md-autocomplete>
Angularjs Code
filltextbox(st){
var autoChild = document.getElementById('autocomplete').firstElementChild;
console.log(autoChild)
var el = angular.element(autoChild);
console.log(el)
el.scope().$mdAutocompleteCtrl.hidden = true;
// return st;
}

Answer 1

I find in these scenarios it is often another $digest or DOM affecting async function that gets in the way of the standard close logic working. The quick hack is to try to close the dialog after a $timeout.
If you have other async processes running on the page, perhaps like executing a search query, and while the search is running a full screen loader is written into the DOM then it might be necessary to set the $timeout delay to a larger value than usual.
The following snippet tries to force the close immediately, and after a timeout to cover all bases, I use this for my md-autocompletes that are serving as a search input with best bet suggestions as well as search results.
filltextbox(st){
closeAutocomplete();
$timeout(closeAutocomplete, 100);
// return st;
}
closeAutocomplete () {
var autoChild = document.getElementById('autocomplete').firstElementChild;
var el = angular.element(autoChild);
el.scope().$mdAutocompleteCtrl.hidden = true;
}
For good measure, I make sure the other async functions that operate on the page also call closeAutocomplete. You could wrap the immediate and $timeout logic into a single call like this that allows you to pass in a variable delay
closeAutocomplete (delay) {
// declare function once, only one point to maintain
var fn = function() {
var autoChild = document.getElementById('autocomplete').firstElementChild;
var el = angular.element(autoChild);
el.scope().$mdAutocompleteCtrl.hidden = true;
};
fn(); // immediate
if(!delay) delay = 100;
$timeout(fn, delay);
}