javascript - 在执行前一个事件的处理程序之前检查下一个事件以隐藏自动完成

Question

我有一个 Angular 输入字段，它的工作方式类似于自动完成下拉菜单。

我在输入与现有数据匹配时显示建议。失去焦点时，我必须隐藏下拉菜单。

<input type="text" 
   ng-model="ctrl.inputs.name"
   ng-blur="ctrl.autocomplete.visible = false"
   ng-keyup="ctrl.handleAutocomplete()"/> <!-- logic for suggestions -->

<div ng-repeat="name in ctrl.names" data-name"{{name.name}}" 
   ng-click="ctrl.setName($event)">
    {{name.name}}
</div>

现在在键入输入时，这工作正常并且我得到了一个项目列表。 理想情况下，您单击列表中的一个项目以在 Controller 中设置它。那时我已经在 Controller 中隐藏了建议 - ctrl.autocomplete.visible = false。

但是在选项的 ng-click 之前，输入时调用了 ng-blur，它隐藏了下拉列表。所以我从来没有接触过 ng-click。删除 ng-blur 工作正常，但我需要在输入焦点丢失时隐藏下拉列表。 帮助表示赞赏。

Answer 1

删除

ng-blur="ctrl.autocomplete.visible = false"

来自

<input type="text" 
   ng-model="ctrl.inputs.name"
   ng-blur="ctrl.autocomplete.visible = false"
   ng-keyup="ctrl.handleAutocomplete()"/>

并设置

ctrl.autocomplete.visible = false;

Controller 文件中 ctrl.setName($event) 方法的最后。