primefaces / primeng

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

Component: p-autocomplete [primeng v18] #16409

Open nicohell opened 3 days ago

nicohell commented 3 days ago

Describe the bug

In p-autocomplete if [multiple] is set to true and reactive form field is set to empty string '' (like example in Angular doc : https://angular.dev/guide/forms/reactive-forms#generate-a-new-component-with-a-formcontrol) there is an error in isSelected() function : this.modelValue(...)?.find is not a function Test does not manage empty string

Environment

Angular 18 Primeng 18.0.0-beta.1

Reproducer

No response

Angular version

18.2.3

PrimeNG version

18.0.0-beta.1

Build / Runtime

TypeScript

Language

TypeScript

Node version (for AoT issues node --version)

22.9.0

Browser(s)

Chrome 128.0.6613.137 (Build officiel) (64 bits)

Steps to reproduce the behavior

  1. create an reactive form with empty string value
  2. use in formControlName of p-autocomplete
  3. click on arrow to display list of suggestions
  4. list does not appear and an error is thrown in console

Expected behavior

Test should manage empty string and display list of suggestions

naichinger commented 6 hours ago

the selectedItems for p-autocomplete should not be of type string since it has multiple values. Therefore an array should be used. When you expand the code in the showcase it shows the correct way https://v18.primeng.org/autocomplete#multiple

    <p-autoComplete 
    formControlName="selectedItems" 
    [suggestions]="items" 
    (completeMethod)="search($event)" 
    [multiple]="true" />
new FormGroup({
    selectedItems: new FormControl([]),
})