Javascript event.stopPropagation（）不处理表单

我有一个简单的角度形式，例如：

  <form [formGroup]="form">
    <div>
      <input type="text" (keydown.enter)="onEnterPerssed($event)" [formControl]="myList" formControlName="myList">
    </div>
   <br>

    <p *ngIf="sendData" class="mt-1">Data send successfully</p>

    <button type="submit" (click)="onSubmit(form)" class="btn btn-block btn-primary mt-2" style="width: 100px;" [disabled]="form.invalid">
    Submit
    </button>
  </form>

---

在不更改按钮类型（submit=>button）的情况下，在输入字段中单击Enter键时，如何防止提交表单有任何解决方案。

更改

表单上的提交事件

标记，并从提交按钮中删除单击事件

onSubmit（事件）{
event.preventDefault（）；
//逻辑就在这里
}

---

ngSubmit

确保处理程序代码抛出时表单不会提交（这是提交的默认行为），并导致实际的http post请求。

在模板中尝试此操作：

在

表单

标记中使用

（keydown.enter）=“$event.preventDefault（）

<form [formGroup]="form" (keydown.enter)="$event.preventDefault()">
    <div>
      <input type="text" (keydown.enter)="onEnterPerssed($event)" [formControl]="myList" formControlName="myList">
    </div>
   <br>

    <p *ngIf="sendData" class="mt-1">Data send successfully</p>

    <button type="submit" (click)="onSubmit(form)" class="btn btn-block btn-primary mt-2" style="width: 100px;" [disabled]="form.invalid">
    Submit
    </button>
  </form>

数据发送成功

提交

这是否回答了您的问题？在您提供的代码示例中，整个文档中都禁用了Enter键。我试图理解为什么event.stopPropagation（）会被禁用在输入字段中不起作用。在整个文档中禁用Enter键是什么意思？？例如，您实际上可以使用Enter键填充文本区域。请不要再看了！

<form [formGroup]="form" (keydown.enter)="$event.preventDefault()">
    <div>
      <input type="text" (keydown.enter)="onEnterPerssed($event)" [formControl]="myList" formControlName="myList">
    </div>
   <br>

    <p *ngIf="sendData" class="mt-1">Data send successfully</p>

    <button type="submit" (click)="onSubmit(form)" class="btn btn-block btn-primary mt-2" style="width: 100px;" [disabled]="form.invalid">
    Submit
    </button>
  </form>