title: Searchbar with filter from JSON data with Ionic 3
body: <p>I would like to have a search bar that filters the results based on the name of the book, I tried to do it but it does not work. When I'm looking for something, nothing happens, no mistake, so I'm wrong, but I do not know what, I'm new to typescript and I ask for help. Thanks in advance</p>
  
  <p>this is my <code>page.html</code>:</p>
  
  <pre><code>&lt;ion-content padding&gt;
      &lt;ion-searchbar placeholder="Filter Items" (ionInput)="getItems($event)"&gt;&lt;/ion-searchbar&gt;
      &lt;ion-grid&gt;
          &lt;ion-row&gt;
              &lt;ion-col *ngFor="let item of items"&gt;
                  &lt;ion-card-header&gt;&lt;h1&gt;{{item.title}}&lt;/h1&gt;&lt;/ion-card-header&gt;
                  &lt;ion-card-header&gt;&lt;h3&gt;Autore:{{item.author}}&lt;/h3&gt;&lt;/ion-card-header&gt;
                  &lt;div id="immagine"&gt;
                      &lt;img src="../assets/{{item.imageLink}}"&gt;
                  &lt;/div&gt;
              &lt;/ion-col&gt;
          &lt;/ion-row&gt;
      &lt;/ion-grid&gt;   
  &lt;/ion-content&gt; 
  </code></pre>
  
  <p>and this is my <code>page.ts</code> file:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { IonicPage, NavController, NavParams } from 'ionic-angular';
  import { HttpClient } from '@angular/common/http';
  import { Observable } from 'rxjs/Observable'
  import 'rxjs/add/operator/map';
  
  @IonicPage()
  @Component({
    selector: 'page-tab2',
    templateUrl: 'tab2.html',
  })
  export class Tab2Page {
   items:any;
  
  
    constructor(public navCtrl: NavController, public navParams: NavParams, public http: HttpClient) {
  this.loadData();
  
    }
  
    loadData(){
      let data:Observable&lt;any&gt;;
      data = this.http.get("assets/books.json");
      data.subscribe(result =&gt; {
        this.items = result;
        this.initiazileItems();
      })
  
     }
  
   initiazileItems(){
     this.items= this.items;
   }
  
   getItems(ev:any){
     this.initiazileItems();
     let val = ev.target.value;
   }
  
   filterItems(ev: any) {
      this.loadData();
      let val = ev.target.value;
      if (val &amp;&amp; val.trim() != '') {
        this.items = this.items.filter((item) =&gt; {
          return (item.title.toLowerCase().indexOf(val.toLowerCase()) &gt; -1);
        })
      }
    }
  }
  </code></pre>
  
  <p>example of my json:</p>
  
  <pre><code>{
      "author": "Hans Christian Andersen",
      "country": "Denmark",
      "imageLink": "images/fairy-tales.jpg",
      "language": "Danish",
      "link": "https://en.wikipedia.org/wiki/Fairy_Tales_Told_for_Children._First_Collection.\n",
      "pages": 784,
      "title": "Fairy tales",
      "year": 1836
  },
  </code></pre>