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

Question

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

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

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

Answer 1

根据the w3c specification：

  

未指定type属性的button元素表示相同   作为按钮元素的东西，其type属性设置为＆＃34;提交＆＃34;。

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

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