primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.46k stars 4.6k forks source link

Component: p-autoComplete multiple=true sometimes causes adding different/multiple values if one of them is a prefix of another #15488

Open malciin opened 6 months ago

malciin commented 6 months ago

Describe the bug

Hello,

I've noticed that <p-autoComplete [multiple]="true" ... /> sometimes causes adding multiple values if one of them is prefix of another, and sometimes causes adding prefix value only rather than selected:

https://github.com/primefaces/primeng/assets/23403545/efecf374-db07-4224-899c-6bdf2cadb6e8

(notice "test" was added rather than "test-1", and later both "test" & "test-1" were added)

To anyone that may have the same issue, the temporary workaround I've came up with is to use suggestions as an objects with prefixed label & custom ng-template:

https://stackblitz.com/edit/github-7hs33e-ciep28?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts

Environment

https://stackblitz.com/edit/github-7hs33e-wudgma?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts

Reproducer

https://stackblitz.com/edit/github-7hs33e-wudgma?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts

Angular version

17.3.7

PrimeNG version

17.16

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

stackblitz so idk

Browser(s)

No response

Steps to reproduce the behavior

  1. Open https://stackblitz.com/edit/github-7hs33e-wudgma?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts
  2. Type "test"
  3. Select "test-1"
  4. Sometimes both "test" and "test-1" were added and sometimes "test" was wrongly added even if user clicked on "test-1".

Expected behavior

Only single selected item is added.

eltortuga92 commented 3 months ago

This bug still exists in 17.18.5.