Angular 9：在空表单的情况下检测输入键答案

【问题标题】：Angular 9 : Detect enter key incase of empty formAngular 9：在空表单的情况下检测输入键
【发布时间】：2021-07-25 13:32:26
【问题描述】：

我试图在提交表单时检测回车键事件，只有在任何表单组件中存在任何值时，回车键事件才有效。

但是在空表单的情况下回车键事件不起作用（即任何表单元素中都没有值）

<form (keydown)="keyDownFunction($event)">
  <input type="text" />
</form>

Ts 文件

keyDownFunction(event) {
        if (event.keyCode === 13) {
          alert("you just pressed the enter key");
          // rest of your code
        }
      }

这里是 stackbliz 网址https://stackblitz.com/edit/angular-7v744e

【问题讨论】：

对我来说，即使字段为空，也会出现警报（我有点预料到，因为字段是否为空绝对无关紧要）。此外，检测表单提交事件可能更有用。
能否请您详细介绍一下表单提交事件
改用(ngSubmit) 处理程序。

标签： javascript angular events

【解决方案1】：

这是一个焦点问题。如果您在光标未聚焦在表单上时按 Enter，则不会注册该事件，类似于如果您有一个 click 事件并且您在范围之外单击。

如果您处于焦点位置，即使表单为空，输入也会被捕获。

要解决这个问题，您应该在表单加载后立即关注它。 This answer here 显示了实现此目的的一种方法，this answer 显示了另一种方法。

【讨论】：