CODEWITHSUNDEEP
jsonangularionic2
Gabriel Barreto
Gabriel Barreto

Reputation: 6421

Ionic 2 searchbar filter by 2 properties

I have a database read that returns me a JSON i'm using in my *ngFor="", in the same page i have a search bar that searchs by the user name, but i also need it o search by the user's description (if it contais the word i'm typing).

Here's my code:

My searchbar:

<ion-searchbar placeholder="Search..." (ionInput)="searchUser($event)"></ion-searchbar>

My searchUser method (the same one ionic 2 docs gives you):

searchUser(ev: any) {
  // Reset items back to all of the items
  this.initializeItems();

  // set val to the value of the searchbar
  let val = ev.target.value;

  // if the value is an empty string don't filter the items
  if (val && val.trim() != '') {
    this.items = this.items.filter((item) => {
      return (item.name.toLowerCase().indexOf(val.toLowerCase()) > -1);
    })
  }
}

And an example of my JSON

{
  "key": {
    "name": name,
    "description": desc,
    "city": city,
    "state": state,
  }, ...
}

The only thing i tried so far is add an && item.description.toLowerCase().indexOf(val.toLowerCase()) > -1 to my return, but i get nothing.

How is the best way to achieve this? With a provider? A correct line of code in my return?

Thanks :)

Upvotes: 1

Views: 2079

Answers (2)

A.&#199;etin
A.&#199;etin

Reputation: 250

Try this,

var searchedText = item['name'] + item['surname'];
return (searchedText.toLowerCase().includes(val.toLowerCase()));

Define extra field that you want to search.

Upvotes: 0

dzonatan
dzonatan

Reputation: 116

I think you should use OR || operator instead of AND &&.
With && you will see only results which matches both name and description.

Upvotes: 2

Related Questions