Angular Material : chips md-autocomplete 从不隐藏建议菜单

Question

我想在 chrome 扩展中输入带有自动完成建议的输入。我遇到了一个很奇怪的问题。

一旦我将焦点放在我的输入上，建议菜单就会以良好的值打开，但是如果我将焦点放在其他地方，建议菜单永远不会隐藏，我仍然可以看到在我的第一个输入下打开了一个空的建议菜单.它只是从不隐藏自己。

所有其他功能都运行良好。

我试过了没有效果：

这是我的 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>

还有我的 JS 代码：

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 ;
    });
};

我问自己它是否不起作用，因为它在 chrome 扩展中，但它看起来太简单了...

我的问题的图片只是为了清楚：

如果有人知道原因或犯同样的错误，谢谢！

马特

Answer 1

我在 chrome 扩展中使用 angular-material 时遇到了同样的问题。将此添加到我的 css 修复了它：

.ng-hide {
display: none;
}

顺便说一下，我还遇到了 ng-show 指令在我的 chrome 扩展中不起作用的问题，添加这个 css class 似乎也解决了这些问题。

Answer 2

新版本 angular material 解决了问题。

Angular Material : chips md-autocomplete 从不隐藏建议菜单

Angular Material : chips md-autocomplete never hide suggestions menu

javascript

autocomplete

angularjs

angular-material

md-autocomplete