我有一個資料串列來進行選擇，效果很好。但是，我希望輸入中的文本在用戶單擊它時清除。現在文本仍然存在，必須手動洗掉才能看到原始串列。 例子
我正在使用 Angular 12。我正在嘗試使用焦點來執行此操作。這是我的 HTML：
<input type="text" list="clinics" class="form-control" formControlName="preferredClinic" (focus)="clearPreference()" placeholder="Search...">
<datalist id="clinics">
<option value="Unsure/No preference"></option>
<option *ngFor="let clinic of clinicList" [value]="clinic">{{clinic}}</option>
</datalist>
這是功能：
clearPreference(){
this.formValue.value.preferredClinic = "";
console.log("This has gained focus");
}
控制臺日志記錄有效，所以我知道（焦點）正在觸發，但它沒有清除輸入欄位。知道我做錯了什么嗎？
uj5u.com熱心網友回復：
嘗試使用這個：
this.formValue.controls.preferredClinic.setValue(''); 或者
this.formValue.setValue({ preferredClinic: '' });
uj5u.com熱心網友回復：
在您的打字稿檔案中：
preferredClinic = new FormControl('');
clearPreference() {
this.preferredClinic.setValue('');
console.log('This has gained focus');
}
在您的 HTML 檔案中
<input
type="text"
list="clinics"
class="form-control"
(focus)="clearPreference()"
placeholder="Search..."
[formControl]="preferredClinic"
/>
<datalist id="clinics">
<option value="Unsure/No preference"></option>
<option *ngFor="let clinic of clinicList" [value]="clinic">
{{ clinic }}
</option>
</datalist>
Stackblitz 示例
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/418222.html
標籤：
上一篇：如何獲取存盤在javascript變數中的影像以顯示在HTML代碼中？
下一篇：如何訪問反向陣列的最后一個元素？