Angular 2阻止Enter以模板驱动的形式提交 [英] 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阻止Enter以模板驱动的形式提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！