Angular 两个按钮提交表单但用途不同

Question

我有一个 Angular react 形式

<form [formGroup]="form" (ngSubmit)="onSubmit()">

我有两个按钮要提交。当用户按下按钮时，我需要执行一个常见的操作，即提交表单，但我还需要区分按钮，因为我需要根据按下的按钮将用户重定向到不同的页面。
这是我的两个按钮:

<button name="Previous" type="submit" [disabled]="form.invalid"> Previous</button>
<button name="Next" type="submit" [disabled]="form.invalid">Next</button>

如何在 OnSubmit 事件中知道按下了哪个按钮？

Answer 1

user1238784，您不应该直接在 Angular 中使用文档，而是使用 ElementRef 或 Renderer2。
虽然这可行，但它违反了最佳实践，如果您决定在某个时候使用 Angular Universal，它将破坏 SSR。
Angular 中的直接 DOM 操作非常重要，您应该始终使用框架提供的 API 操作 DOM。
但是您甚至不需要任何这些，您可以像这样将事件作为参数传递:

<form [formGroup]="form" (ngSubmit)="onSubmit($event.submitter.id)">

然后在组件中你可以使用事件来识别被点击的按钮
这是您可以访问用于提交表单的输入/按钮的 id 的方式

submitForm(event : MouseEvent) :void
  {
    console.log(event)
  }