Searchbar Ionic 2

Asked

Viewed 428 times

0

I managed to implement the searchbar as documented by IONIC 2.

The problem is I’m bringing information from a remote database and I can’t implement this database data into searchbar. It is a matter of passing the variable array into the function initializeItems(), I just can’t.

I’ve tried to put initializeItems(){this.item[]}, but then the value is null, follows below the codes I have:

TYPESCRIPT

export class ListaPage {
  items:any[];
  searchQuery: string = '';
  constructor(public navCtrl: NavController, public service:ServiceProvider) {
    this.getDados();
    this.navCtrl=navCtrl;
    this.initializeItems();
  }
  getDados(){
    this.service.getData().subscribe(
      data =>this.items=data,
      err =>console.log(err)
    );
  }
  chamaProd(pr){
    this.navCtrl.push(ProdutoPage, {id: pr});
  }
  initializeItems() {
    this.items = ['aqui','que','quero','chamar','os dados','do banco'];
  }
  getItems(ev: any) {  
     this.initializeItems();
     let val = ev.target.value;
     if (val && val.trim() != '') {
       this.items = this.items.filter((item) => {
         return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
       })
     }
   }
}

HTML

<ion-searchbar (ionInput)="getItems($event)"></ion-searchbar>
  <ion-item-sliding *ngFor="let item of items">
    <div  *ngFor="let item of items">
       {{item.nome}}
</div>
  • Try to exchange this initializeItems(){this.item[]} so initializeItems(){this.item}

  • @Robertofagundes, I tried but it wasn’t, it only works with array ['here','I','I want','call','data','from the database'], when I passed the parameter this.item; it returns an error item.toLowerCase is not a Function

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.