Angular2 - 如何使第二个按钮成为提交按钮

Question

假设我有一个表单，带有取消按钮和提交按钮。我希望取消按钮出现在验证按钮的左侧。当您按“Enter”时，它应该触发提交按钮，而不是取消按钮。 Angular2的工作方式，第一个按钮始终是由“Enter”键触发的按钮。

<button (click)="onCancel()">Cancel </button>
<button> (click)="onSubmit()">Submit</button>

在此示例中，将触发取消按钮而不是提交。如何改变提交按钮，同时保持相同的顺序？

Answer 1

据the w3c specification说：

未指定type属性的button元素表示与其type属性设置为“submit”的button元素相同的元素。

所以我会将type="button"属性添加到取消按钮：

<button type="button" (click)="onCancel()">Cancel </button>
        ^^^^^^^^^^^^^
<button> (click)="onSubmit()">Submit</button>