Angular 2 防止输入以模板驱动的形式提交 [英] Angular 2 prevent enter from submitting in template-driven form

问题描述

我有使用模板驱动蓝图的表单，所以是这样的:

I have forms that uses the template-driven blueprint, so something like this:

<form #myForm="ngForm" ngSubmit="save(myForm.value, myForm.isValid)">
  <input #name="ngModel" [(ngModel)]="name">
  <button type="submit">Submit form</button>
</form>

现在，如何防止 ENTER 提交表单?它会干扰表单内的自定义 ENTER 行为，并且还会干扰您在输入中不小心按 Enter 键，这是不需要的.

Now, how can I prevent ENTER from submitting the form? It interferes with custom ENTER behaviour inside of the form and also if you accidentally press enter in an input, which is unwanted.

我环顾四周，发现了一些旧的 Angular 1 答案以及一些标准的 JavaScript 答案，但我觉得 Angular 2 必须已经内置了类似的东西，但我一直找不到.

I've looked around and found some old Angular 1 answers and also some standard JavaScript ones but I feel that Angular 2 must have something like this already built in but I haven't been able to find it.

如果他们不这样做，实现这一目标的最佳方法是什么?

If they don't, what would be the best way to achieve this?

推荐答案

事实证明，您可以使用以下简单的方法:

Turns out that you can use something as simple as:

<form (keydown.enter)="$event.preventDefault()"></form>

防止表单在 ENTER 时提交.

To prevent the form from submitting on ENTER.

这篇关于Angular 2 防止输入以模板驱动的形式提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！