提交表单后清除无效状态

Question

我正在尝试使用angular提交表单，表单已成功提交。
问题在表单提交后，下拉列表显示为无效状态。如何删除它。

<form class="form-inline" name="form" #invoiceheaderform="ngForm" novalidate (ngSubmit)="invoiceheaderform.form.valid && fileNameList();">
<label for="bank" class="lb-adj">Banks</label>
<select class="form-control fix-dropdown" required   [ngClass]="{'is-invalid':invoiceheaderform.submitted && orgname.invalid}" #orgname="ngModel" [(ngModel)]="orgNameModel.orgName" name="orgName"> 
  <option value="">--Select--</option>
   <option *ngFor="let bank of orgNameModel | async">{{bank}}</option> 
</select>
 <button type="submit" [disabled]="disableRunButton" class="btn btn-primary mb-2 expad">Search</button>
</form>

Answer 1

尝试此操作，成功提交表单后，将变量更改为undefined

this.orgNameModel.orgName = undefined;

使用reset()的最新角度形式无法正常工作。

编辑

您使用async作为选项可能会影响功能。请尝试删除async并为选项提供一个数组

<select class="form-control fix-dropdown" required   [ngClass]="{'is-invalid':invoiceheaderform.submitted && orgname.invalid}" #orgname="ngModel" [(ngModel)]="orgNameModel.orgName" name="orgName"> 
  <option value="">--Select--</option>
   <option *ngFor="let bank of orgNameModel">{{bank}}</option> 
</select>

component.ts

orgNameModel:any = [];
//assign the list of banks to orgNameModel

Answer 2

像这样修改您的第一个<option>标签-

  <option value="undefined" disabled="true">--Select--</option>