Question

如何在选定项目后隐藏自动完成下拉列表我尝试了很多类型但没有成功，任何人都帮助我，非常感谢

<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代码

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

我发现在这些场景中，它通常是影响异步函数的另一个$ digest或DOM，它阻碍了标准关闭逻辑的工作。快速破解是在$ timeout之后尝试关闭对话框。

如果您在页面上运行其他异步进程，可能就像执行搜索查询一样，并且在搜索运行时将全屏加载器写入DOM，则可能需要将$ timeout延迟设置为更大价值比平常。

以下代码段尝试立即强制关闭，和超时后覆盖所有基础，我将此用作我的md-autocompletes，用作搜索输入，同时提供最佳投注建议作为搜索结果。

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

为了更好地衡量，我确保在页面上运行的其他异步函数也会调用closeAutocomplete。你可以将立即和$ timeout逻辑包装成一个这样的调用，允许你传入一个可变延迟

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

如何隐藏下拉列表md-autocomplete

1 个答案: