如何為primeng自動完成設置默認值<p-autocomplete>

Question

我在下面嘗試過，但沒有奏效。

在下面添加到<p-autocomplete>

[ngModelOptions]="{standalone: true}"和[(ngModel)]="sampleModelData"

並在 .ts 文件中添加

this.sampleModelData='ramesh';

即使我嘗試在 .ts 文件中進行如下設置，但這也不起作用。 (<HTMLInputElement>document.getElementById('sampleModelData')).value='ramesh123';

如何解決問題

Answer 1

您需要獲取對可以訪問輸入本機元素的自動完成組件的引用

  @ViewChild('autoItems', { static: true }) public autoItems: AutoComplete; // 👈

  setAutoValue() {

    this.selectedValue = {label:'Apple' , value:'apple'}; 
    this.autoItems.inputEL.nativeElement.value = this.selectedValue.label; // 👈
  }

模板

<p-autoComplete [(ngModel)]="selectedValue" field="label" [suggestions]="result" 
   (completeMethod)="search($event)"#autoItems>
</p-autoComplete>

演示🚀