angular - Angular 表单：提交事件和点击事件有什么区别？

Question

我想知道表单提交事件和按钮单击事件之间有什么不同来执行 http post 操作。

表单提交示例：

<form #f="ngForm" (ngSubmit)="onSubmit(f)">
  <input name="first" ngModel required #first="ngModel">
  <input name="last" ngModel>
  <button>Submit</button>
</form>

按钮点击示例：

<form #f="ngForm">
  <input name="first" ngModel required #first="ngModel">
  <input name="last" ngModel>
</form>

<div>
  <button (click)="onSubmit(f)">Submit</button>
</div>

在后台，处理是一样的。

  @ViewChild(NgForm) f: NgForm;

  onSubmit() {
    console.log(this.f);  
  }

有谁知道有什么区别？

非常感谢。

标签： angular

Answer 1

不同之处在于它们是注册到 DOM 中不同元素的两个不同事件。

submit事件在元素<form>本身上触发，而不是在任何<button> .Submit 事件仅在用户单击提交按钮时触发

默认情况下，您的提交按钮的类型为type="submit"

另一方面，当用户单击一个元素（在本例中为您的按钮）时会触发click事件。