如何使用 Angular 2 / 4 禁用表单中的输入操作？

Question

我正在更新一个在Angular中完成的项目 4. 该网站由多个表单组成，其中包括输入字段。当用户按下 'enter' 时，表单正在提交。我想防止这种情况发生。我该怎么做？

我可以在引号内放置什么来阻止提交操作发生吗：(keydown.enter)=""

form.component.html

<div class="d-flex justify-content-center hm-row">
  <form class="hm-form" [formGroup]="crossingForm">
    <div class="form-group">
      <label for="dynamicThresholdTime">{{ 'CROSSING.DYNAMIC_THRESHOLD_TIME' | translate}}</label>
      <input type="text" class="form-control" id="dynamicThresholdTime" placeholder="" formControlName="dynamicThresholdTime">
     </div>
     <...more code...>
   </form>
</div>

Answer 1

使用这个：

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

Answer 2

您也可以删除 form 标签并将其替换为 div。由于 form 标签，浏览器会产生这种行为。

Answer 3

带有 type="submit" 的按钮具有默认行为。选择 type="button" 表示没有默认值。

表单和输入字段也发生过这种情况。 event.preventDefault() 在我的客户端脚本中解决了这个问题。

如何使用 Angular 2 / 4 禁用表单中的输入操作？

How to disable an enter-action within a form using Angular 2 / 4?

html

angular2-forms

angular