Component: Autocomplete. Option Value and FormControl as an Object

Describe the bug

Hi, I am using autocomplete components with the snippet below:

HTML

[...]
<p-autoComplete
            #test
            placeholder="Add participants"
            optionLabel="name"
            optionValue="id"
            appendTo="body"
            multiple
            [formControl]="transactionForm.controls.participants"
            [suggestions]="participants()"
            (completeMethod)="search($event)" />
[...]

while transactionForm.controls.participants = new FormControl<string[]>([]); // which will contains only ids participants = signal<{name: string, id: string}[]>([]); // the suggestion list

search($event: AutoCompleteCompleteEvent) {
        const filteredParticipants = [
            ...this._participants
                .filter(member => member.id !== this.hostId())
                .filter(
                    member =>
                        member.name
                            .toLowerCase()
                            .indexOf($event.query.toLowerCase()) === 0 ||
                        member.name.toLowerCase() === $event.query.toLowerCase()
                ),
        ];
        this.participants.set(filteredParticipants);
    }

I expect that whenever I search a value, if it does not have the result the rest selected value should stay the same But actually, the selected one becomes empty on the view (but the form control still keeps the selected id value). Please refer to the image below

I tried to remove the optionValue, It worked but the result that is filled into the formControl does not satify the requirement (It filled in with objects instead of id strings as expected)

Is there any other way to overcome this? Thank you for your effort

Environment

Development

Reproducer

No response

Angular version

18.2.0

PrimeNG version

17.18.11

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v20.18.0

Browser(s)

Chrome

Steps to reproduce the behavior

Search a value that is existed in the suggestion list
Select one from the result
Continue searching a value that is not existed in the suggestion list

Expected behavior

Expect: If the search value does not exist in the list, the selected value will stay the same on the view Actual: The selected value becomes empty on the view (BUT the form control still keeps the selected id value)

primefaces / primeng