Angular FormGroup form.reset（）影响mat错误

我试图在FormGroup的表单中使用mat错误。我有一个拍卖网站，当我出价时，我让它执行

this.form.reset（）

以在提交后清除字段，但当我清除字段时，我的mat错误会消失。如何清除表单字段而不导致mat错误打开

 <div id="bidding">
   <mat-form-field appearance="outline" class="formFields">
      <mat-label id="placeholder">Enter Bid</mat-label>
      <input id='listing-{{auction.id}}' matInput name="bidInput" type="text" required
         formControlName="bidInput" pattern="^\$?(([1-9]\d{0,3}(,\d{3})*)|0)?\.\d{2}$" />
      <mat-error>Dollar Format 00.00 or 0.00</mat-error>
   </mat-form-field>
   <button id="auctionButton" mat-raised-button type="submit"
      (click)="confirmBid(auction.currentBid, auction.id)">Submit
   Bid</button>
</div>

投标
美元格式00.00或0.00
提交
投标

您需要使用。有关更多详细信息，请访问

---

第一条路

<!-- xxxxxx.controller.html -->

<form [formGroup]="form"> .... </form>

<!-- xxxxxx.controller.html -->

<form [formGroup]="form"> 
  ....
  
  <button type="button" mat-raised-button (click)="form.reset()">
    reset
  </button>
</form>

<!-- xxxxxx.controller.html -->

<form [formGroup]="form"> 
  ....
  
  <button type="button" mat-raised-button (click)="resetForm(form)">
    reset
  </button>
</form>

---

第二种方式

<!-- xxxxxx.controller.html -->

<form [formGroup]="form"> .... </form>

<!-- xxxxxx.controller.html -->

<form [formGroup]="form"> 
  ....
  
  <button type="button" mat-raised-button (click)="form.reset()">
    reset
  </button>
</form>

<!-- xxxxxx.controller.html -->

<form [formGroup]="form"> 
  ....
  
  <button type="button" mat-raised-button (click)="resetForm(form)">
    reset
  </button>
</form>

---

您是否可以尝试将

ngIf

添加到

mat错误中，以仅在
FormName.get（'bidInput'）.hasrerror（'pattern'）”
时显示，并查看发生了什么情况。如果控件无效且已触碰，则会显示mat错误。reset（）将控件标记为未触碰。这就是“错误”的原因“梨。解决方案重置后，标记为touched@Kardon63我试过了，它确实删除了mat错误消息，但是mat表单字段仍然将边框染成红色，就好像有错误一样。它们默认为黑色。我怎样才能让mat form字段也很好地发挥作用？@Eliseo我尝试了这个
this.form.reset（）；this.form.markAsTouched（）但这没有任何区别。错误出现，mat表单字段变为红色突出显示，好像有错误。我认为，因为该字段是
必需的
，因此您需要在第一个
mat错误下添加另一个
此字段是必需的
，请尝试并用结果通知我第三种方法对我很有效。谢谢我明天会把赏金释放给你。它不允许我使用自动取款机。