Html 如何在ng模糊之前调用ng click？

我创建了一个文本输入，输入时会出现一些建议（就像在谷歌上一样，你正在写东西，它会建议你一些文本）

{{nt.Tag.Name}

我想添加点击其中一个“建议”的可能性（在html属性中有ng click属性）。不幸的是，ng blur似乎比ng click更早工作，所以当我单击其中一个选项时，输入会失去焦点，并且suggestionList在检测到click之前不可见

---

如何在隐藏建议列表之前检测单击？

您不能。但是，您可以使用

ngMousedown

而不是

ngClick

来实现所需的功能：

HTML:

ng-mousedown="suggestionClicked($index, $event)

$scope.suggestionClicked = function(index, evt) {
    //detect left click
    if(evt.which === 1) {
        //your code
    }
}

JS:

ng-mousedown="suggestionClicked($index, $event)

$scope.suggestionClicked = function(index, evt) {
    //detect left click
    if(evt.which === 1) {
        //your code
    }
}

---

其中一个选项是使用

$timeout

延迟删除建议列表，以及

$cancel

单击事件的超时

var suggestionTimeout = $timeout(angular.noop);

function setSuggestionFalse = function() {
    vm.showSuggestions = false;
 };

vm.onSmartBarBlur = function () {
    //delay the removal
    suggestionTimeout = $timeout(setSuggestionFalse, 50);
};

vm.onSuggestionClick = function () {
    //cancel the removal
    $timeout.cancel(suggestionTimeout);
    //show suggestion
};

---

有关$timeout的更多信息，请参阅。

在开发自己的自动完成下拉列表时遇到了完全相同的问题。$timeout和ng mousedown解决方案对我来说都太脏了，并且有负面的用户体验副作用。这就是我最终得出的结论：

var suppressInputFocusedChange = false;

$scope.onBlur = function() {
    if(suppressInputFocusedChange === true) {
        suppressInputFocusedChange = false;
        return false;
    }
    $scope.showSuggestions = false;
};

$scope.onFocus = function() {
    $scope.showSuggestions = true;
};

$scope.suggestionMouseDown = function() {
    suppressInputFocusedChange = true;
};

$scope.suggestionClicked = function() {
    $scope.showSuggestions = false;
};

---

因此，基本上，当您开始单击该项（ng mousedown）时，您将suppressInputFocusedChange标志设置为true。当此标志处于打开状态时，“onBlur”方法将不起任何作用，并且该列表将被suggestionClicked方法隐藏

setTimeout（隐藏，50）？问题与angular无关，而完全与浏览器如何处理这些事件有关。除此之外，主要问题：
ng focus=“showSuggestions=true”ng blur=“showSuggestions=false”
要求提取到指令中。还有-你是不是想用这个视图做点什么？可能是CSS中的target
input:focus{}
而不是使用JS？对于类似的功能，我创建了一个指令来检查点击是否超出了整个typeahead的范围，并排除了建议