Dropdown: filterBy should fall back to optionLabel

[jakob-bebop]

Describe the bug

With [filter]="true", when setting optionLabel, but not setting filterBy, filtering does not work.

I get the following:

core.mjs:10920 ERROR TypeError: option.toLowerCase is not a function
    at primeng-dropdown.mjs:644:58
    at Array.filter (<anonymous>)
    at ComputedImpl.computation (primeng-dropdown.mjs:644:32)
    at ComputedImpl.recomputeValue (core.mjs:2646:29)
    at ComputedImpl.onProducerUpdateValueVersion (core.mjs:2632:14)
    at ComputedImpl.producerPollStatus (core.mjs:2541:14)
    at Watch.consumerPollProducersForChange (core.mjs:2454:26)
    at Watch.run (core.mjs:2844:49)
    at core.mjs:12695:38

which again points to the second-last line of

    visibleOptions = computed(() => {
        const options = this.group ? this.flatOptions(this.options) : this.options || [];
        if (this._filterValue()) {
            const filteredOptions = !this.filterBy && !this.filterFields && !this.optionValue
                ? this.options.filter((option) => option.toLowerCase().indexOf(this._filterValue().toLowerCase()) !== -1)
                : this.filterService.filter(options, this.searchFields(), this._filterValue(), this.filterMatchMode, this.filterLocale);

Reproducer

https://stackblitz.com/edit/github-m9lde8?file=src%2Fapp%2Fapp.component.html

Angular version

16.2.2

PrimeNG version

16.9.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.10.0

Browser(s)

Chromium

Steps to reproduce the behavior

In previous versions, when providing "optionLabel" to the dropdown, the filter would work as expected.

• In the current version, I have to provide "filterBy" explicitly (set to the same property name) to get the expected behavior

• Even when "filterBy" is set, the "emptyFilterMessage" does not show up (neither does it's default, nor the "emptyfilter" pTemplate)

Expected behavior

The filter function should fall back to comparing the same value that is being used to display the label.

[exon-reyes]

Estoy observando algo similar en mi proyecto de trabajo. Mi componente p-drowndown no está realizando el filtrado al establecer filterBy="clave,nombre", solo aplica un filtrado, no el filtrado multiple.

[jakob-bebop]

The bug is still there with angular 17.0.6 and primeng 17.0.0

[yassine-fy94]

Im facing the same issue on :
"@angular/core": "^17.0.7",
"primeng": "^17.1.0",

[mertsincan]

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,