当从执行路径更改的表单中触发取消按钮时，组件更改会暂时暂停？

Posted 2021-04-04

我想让用户有机会在表单上点击取消。此组件仅显示表单。我想将取消按钮放在表单内部，使其位于提交按钮旁边，但是当用户触发取消按钮时，我想更改路由并显示about组件。

每当我尝试以下任何一项时：

`
onCancel(){    
    return this.location.back();
  }
`

`
onCancel(){    
    return this.router.navigate(['/about']);
  }
`

`
<mat-card-actions>
      <button mat-raised-button [disabled]="!contactForm.valid" color="primary" type="submit">Submit</button>
      <button mat-raised-button color="warn" routerLink="/about">Cancel</button>
    </mat-card-actions>
`

路由的转换暂时暂停，页面上的URL更改为正确的路径，但是它会附加一个？关于约？路径，然后大约2秒后它改变路线。

如何在表单中包含取消按钮？

这是发生了什么

答案

只是想回答这个问题，因为Daniel W Strimpel想出来了。问题是我没有在取消按钮上明确设置类型。默认设置为"type=submit"，当我将其更改为"type=button"时，它都按预期工作。