在Angular 6（响应式表单）中单击按钮时是否重置表单组？

Question

单击按钮后，我试图清除表单值。 下面显示了HTML和Angular组件。在同一按钮上，单击我要重置或刷新值。 谢谢。

 onAddClientNeeds() {
        
        this.listOfNeedsAssessment.push(this.needsAssessment.value);
        this.isNeedsAssessmentAdded = true;
    }

<div [formGroup]="needsAssessment" class="main-container">
    <div class="header-section">
    <div class="flex-container">
        
            <div class="edit-section">
                <p class="edit-title">Mental Health</p>
                <div class="edit-body">
                    <select class="form-control" (change)="onchange($event)" (blur)="onchange($event)" id="mental_health">
                        <option selected value="0">Select Option</option>
                        <option *ngFor="let mentalHealth of mentalHealthList" value={{mentalHealth.Id}}>{{mentalHealth.Item}}</option>
                    </select>
                </div>
            </div>
            <div class="edit-section">
                <p class="edit-title">Persistant Pain</p>
                <div class="edit-body">
                    <select class="form-control" (change)="onchange($event)" (blur)="onchange($event)" id="persistant_pain">
                        <option selected value="0">Select Option</option>
                        <option *ngFor="let persistantPain of persistantPainList" value={{persistantPain.Id}}>{{persistantPain.Item}}</option>
                    </select>
                </div>
            </div>
            
        <div class="button-select">
            <button type="button" class="create-button" (click)="onAddClientNeeds()">Add Needs Assessment Outcomes</button>
        </div>
    </div>
</div>

Answer 1

只需调用函数reset（）

onAddClientNeeds() {
  if (this.needsAssessment.valid) {
    this.needsAssessment.reset();     
  }
}