I want to have an input with autocomplete suggestions in a chrome extension. I face a very weird issue.
Once I get the focus on my input, the suggestions menu is opened well with good values but then if I focus anywhere else, the suggestion menu never hide, I still can see an empty suggestion menu opened under my first input. It just never hides himself.
All the other functionalities are working well.
I tried this without effect : Angular Material: md-autocomplete - how to hide md-autocomplete-suggestions on Enter event?
Here's my html :
<md-chips ng-model="ctrl.newTags"
md-autocomplete-snap
md-transform-chip="ctrl.newVeg($chip)"
md-require-match="false">
<md-autocomplete id="Auto"
md-selected-item="ctrl.selectedItem"
md-search-text="ctrl.searchText"
md-items="item in ctrl.querySearch(ctrl.searchText)"
md-item-text="item.name"
placeholder="Enter a tag">
<span md-highlight-text="ctrl.searchText">{{item.value}}</span>
</md-autocomplete>
<md-chip-template>
<span>
<strong>{{$chip.value}}</strong>
</span>
</md-chip-template>
</md-chips>
And my JS code :
self.newVeg = function(tag) {
if (angular.isObject(tag)) {
return tag.value;
} else if (angular.isString(tag)) {
return tag;
}
};
self.querySearch = function(search) {
search = search || "";
return self.existingTags.filter(function(vO) {
return !search || vO.value.toLowerCase().indexOf(search.toLowerCase()) >= 0 ;
});
};
I'm asking myself if it doesn't work because of the fact it's in a chrome extension but it looks too simple...
The picture of my problem just to be clear :
Thanks if anyone knows why or get the same mistake !
Matt.
