This is what I have and tried to do. I get an error; Runtime Error
Error in ./Page1 class Page1 - caused by: item.toLowerCase is not a function
This is a searchbar with the code from ionic itself. https://ionicframework.com/docs/components/#searchbar
I do not know what to do now, all the help is appreciated!
Thanks in advance!!
`import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-page1',
templateUrl: 'page1.html'
})
export class Page1 {
searchQuery: string = '';
items: any;
getItems(ev: any) {
this.initializeItems();
// set val to the value of the searchbar
let val = ev.target.value;
if (val && val.trim() != '') {
this.items = this.items.filter((item) => {
return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
})
}
}
constructor(public navCtrl: NavController) {
this.initializeItems();
}
initializeItems(){
this.items = [
{name: 'Hasan Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 1'},
{name: 'Amcik Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 1'},
{name: 'Pezo Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 1'},
{name: 'Ala Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 2'},
{name: 'Ebenin Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 2'},
{name: 'Ami Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 2'},
{name: 'Emrah Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 3'},
{name: 'Danny Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 3'},
{name: '6pack Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 3'},
{name: 'Marco van Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 4'},
{name: 'Shabalasdbah Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 4'},
{name: 'Lange namen Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 4 '},
{name: 'Yarrag Sezen', avatar: 'http://placehold.it/100', groep: 'Groep 3'}
];
}
}
`