Show suggestion on focus using PrimeNG autocomplete component

It may help if you need additionally to display suggestion when the input field of autocomplete is cleared. Therefore 2 events will be handled: onFocus and onClear. Here is the workaround:

In template bind onClear event with function clearItem():

<p-autoComplete ...
    #autocomplete
    (onFocus)="!autocomplete.value && autocomplete.handleDropdownClick()"
    (onClear)="clearItem(autocomplete)">
</p-autoComplete>

In component implement function clearItem() when onClear event is triggered:

clearItem(autocomplete: any) {
    autocomplete.value = '';  
    autocomplete.handleDropdownClick();  
}

The autocomplete has the onFocus() event, you can show the suggestions by calling the .show() method.

<p-autoComplete  #autoComplete [formControl]="control.controls.EJ_Id_Name" 
  (onFocus)="autoComplete.show()"
  [suggestions]="results" 
  (completeMethod)="search($event,'EJ')" 
  emptyMessage={{noResult}} 
  [autoHighlight]="true">
</p-autoComplete>

Edit:

It seems like there a bug with the autocomplete, as a workaround you can try this

<p-autoComplete  #autoComplete [formControl]="control.controls.EJ_Id_Name" 
  (onFocus)="!autocomplete.value && autocomplete.handleDropdownClick()"
  [suggestions]="results" 
  (completeMethod)="search($event,'EJ')" 
  emptyMessage={{noResult}} 
  [autoHighlight]="true">
</p-autoComplete>

Source