How to use searchbar with autocomplete for an array of key-values?

Ionic Framework
1

Hi everybody,

My problem i dont know what i’m doing wrong because cannot use a searchbar with autocomplete, the list is key-value and cannot filter it, what is the best solution? Then i have to click on some item of the list and set it on searchbar value…

Here is my code:

TS

    search(event) {
        console.log(event)
        this.initializeListCountries();
        const val = event.target.value;
        if (val && val.trim() != '') {
            this.countries = this.countries.keys.filter((country) => {
                return (country.key.toLowerCase().indexOf(val.toLowerCase()) > -1);
            })
        }
    }

    selectCountry(country) {
        let val = country.target.key;
    }

<ion-content padding>
    <ion-searchbar type="text" debounce="500" animated 
        placeholder="Filtrar por país" color="dark"
        (ionChange)="search($event)" clearInput></ion-searchbar>
    <ion-list>
        <ion-item *ngFor="let country of countries" (click)="selectCountry($country)">
            {{ country.value }}
        </ion-item>
    </ion-list>
</ion-content>

Thank you so much,