如何在Angular 2中隐藏闪烁的光标？

Question

我正在使用用户输入关键字的搜索栏。当用户点击回车键时，显示结果。我想以这种方式实施 -

每当用户点击输入搜索关键字的结果时，您可以看到关键字末尾没有闪烁的光标。当您访问google.com并单击输入框时，不会发生这种情况。那时，我们看到一个闪烁的光标。

我面临的问题是，当用户点击回车键时，会显示结果，但光标仍会在搜索栏中闪烁。我该怎么办才能解决这个问题，以便点击输入框应该显示一个闪烁的光标但是在按下回车键时，它会隐藏闪烁的光标？

注意 - 由于我不知道，如何生成此问题我没有提供代码。我只是想对代码有一些粗略的想法我应该如何进行。 ：）

Answer 1

这是通过将焦点从输入字段中移除来完成的，这需要一点点javascript。

我不知道您的代码是如何工作的，因为您没有提供代码，但表单提交将是我想象的，您将如何在输入时触发操作？

所以我会做一个快速的例子......

我们有一个填充了输入字段的表单。

var form = document.querySelector('#form');
var input = document.querySelector('#text');

form.onsubmit = function(e) {
  e.preventDefault();
  text.blur();
}

<form id="form">
  <input type="text" id="text">
</form>

使用.blur将焦点从输入中移开。

我想念你的问题，看到你是用Angular做的，但是我会把原来的答案留给那些可能偶然发现这个答案的人。

要在Angular中执行此操作，它具有ng-enter的可爱属性。

然后，我们可以通过执行<input type="text" ng-enter="$scope.blur()" />

将其添加到输入中

然后我们可以通过

创建此操作

$scope.blur = function($event) {
    var input = $event.target;

    input.blur();
}