This should be fixed in recent PrimeNG release, please try with it and if the issue persists drop a comment with along with a test case based on plunkr below and we'll review again.

http://plnkr.co/edit/Wj39h1?p=preview

@cagataycivici : I can still reproduce this issue starting from the Plunkr you provided (this uses PrimeNG 4.1.0.RC2 if I'm correct):
http://plnkr.co/edit/vKhkap?p=preview

Ok reopening then to be reviewed. Thanks.

Is this planned for a new milestone?

I'd also like this functionality.

I also need this functionality

Any news on this? Recent install, and still running against this issue. Tho it is documented in the spec: https://www.primefaces.org/primeng/#/autocomplete

In single mode, there is an input so can't think of a way to use the selectedItemTemplate and the input at the same time so that's why it was closed I guess. Not sure how we can offer templating for the value prop of the input field.

@cagataycivici : I don't understand what you mean by your last comment. Is something unclear about my initial question?
In the example of my Plunkr: When I select "Smith John" in the autocomplete, I'd like to see "Smith John" instead of "Smith" in the input field of the autocomplete. Currently it's not possible to display more than 1 field/property of the selected object in the input of the autocomplete. This should be possible just like you can already define a selectedItemTemplate for the multiple selection mode and just like you can define an itemTemplate for the items in the suggestion list of the autocomplete.

I also need this functionality

I need this functionality too.

@cagataycivici I've implemented templating before using contenteditable="true" on a div. I did this in AngularJS using uib-typeahead. Unfortunately the new Angular implementations all require the selector on an "input" which makes this difficult. I'm hoping PrimeNG can implement it so it uses a <div> with contenteditable="true" in place of an <input>

Workaround using conversion method:

Lets say we have a User type:

interface User {
  firstName: string;
  lastName: string;
}

Use:

<p-autoComplete [field]="myUserConversionMethod" ...></p-autoComplete>

And in Component:

public myUserConversionMethod(user: User) {
  return user.firstName + ' ' + user.lastName;
}

Workaround works, thanks.

I notice a mismatch between code and documentation...

In the documentation 'field' is declared as 'any'.
So, I can use a conversion method or not (description suggests that i can not) ?

Name	Type	Default	Description
field	any	null	Field of a suggested object to resolve and display.

In AutoComplete component, 'field' attribute is declared as 'string'.
I must not use a conversion method ?

    @Input() field: string;

This needs to be clarified.

@flix- can you provide a stackblitz with the workaround? [field] conversion doesn't seem to work.

Same issue with angular 8. also related the attribute field can only be of type string. If it's a number it gives following error:

ERROR TypeError: itemValue.trim is not a function
at _loop_1 (autocomplete.js:398)
at AutoComplete.push../node_modules/primeng/components/autocomplete/autocomplete.js.AutoComplete.onInputChange (autocomplete.js:409)

@cagataycivici We also need this functionality.

A very bad workaround with a weird flickering:

@ViewChild('inputSearchTerm', {static: false}) inputSearchTerm: AutoComplete;

_searchTerm: string;

onSelectItem(item: any): void {
  this.inputSearchTerm.inputEL.nativeElement.value = this._searchTerm;
}

Hi all,
is there an update to show more properties than just one.
I am using "primeng": "11.3.2", with "angular": "11.2.7" and when trying to workaround from @flix- I get an error:
Type '(user: User) => any' is not assignable to type 'string'.

Any update on this issue?
(Using Angular 12.1.1 and PrimeNG 12.0.1 btw)

I stumbled across this issue and found that the conversion method still works. As described by @ben12 it is just a compiler error as the autocomplete component declares the field input as string.

You can force angular to ignore this template error by surrounding the variable with $any:

<p-autoComplete [field]="$any(myUserConversionMethod)" ...></p-autoComplete>

This actually works fine for me using primeng 12.2.2 and Angular 12.2.

Hi,

So sorry for the delayed response! Improvements have been made to many components recently, both in terms of performance and enhancement. Therefore, this improvement may have been developed in another issue ticket without realizing it. You can check this in the documentation. If there is no improvement on this, can you reopen the issue so we can include it in our roadmap?
Please don't forget to add your feedback as a comment after reopening the issue. These will be taken into account by us and will contribute to the development of this feature. Thanks a lot for your understanding!

Best Regards,

@mertsincan thanks!
But i don't use PrimeNG anymore.
I'm submitted this 4 years ago.
Because there was no reaction – switched to another UI.

It still doesn't work.
Tested with version 14

This issue is not solved. I need this functionality as well.

This is still an issue after all those years. Should be reopened. Workarounds don't seem to work. I'm on Angular 15 and PrimeNG 15.

Is there any progress? I have the same issue and the workarounds do not work. Can also the documentation be extended so the devs know that the selectItem template only works for multiple but not single selection mode.

Same problem. At least the doc could be explicit

Still an issue in v16

still an issue in v17, selectedItem Template is not working