Same error in my case: "Cannot read property 'ionChange' of undefined"

With the second option (with BehaviourSubjects) works great. Thanks!

I got the error. "Cannot read property 'ionChange' of undefined".
I think there is problem on this code.
const searchFilter$ = this.searchBar.ionChange.pipe(
map(event => (event.target as HTMLInputElement).value),
startWith("")
);

plz help tq :)

Hello Chamii. Based on the error, it seems the searchBar variable is not getting mapped properly to the UI component which is why it is null. In your HTML, make sure you have #searchBar in your ion-searchbar.

I already put it
<ion-searchbar #searchbar=""></ion-searchbar>
like this right? But is still error. I dont know how.

ignore the =""

You have #searchbar but it should be #searchBar. That might be causing the issue.

I corrected it and it still have the same error. :(

Here is my code regarding the ionsearch bar
in my ts.

import { IonSearchbar } from '@ionic/angular'

@ViewChild('searchBar',{static: true})searchBar:IonSearchbar;

const searchFilter$ = this.searchBar.ionChange.pipe(
map(event => (event.target as HTMLInputElement).value),
startWith("")
);


in my html.

<ion-searchbar #searchbar=""></ion-searchbar> //ignore =""

I already check the spelling and others. still error :(