Error search ion-Searchbar

Question

Good night to you all I’m having a problem with a research code and I’d like some help. As you type in the search field, the list changes and works normally, but when you delete what you type, the list does not return with all the elements. Can someone help me? Thank you

<ion-list>
    <ion-item *ngFor="let topic of cuponsTotais">
      {{ topic.numerocupom }}
    </ion-item>
  </ion-list>

Array: (12) [{... }, {...}, {...}, {...}, {...}, {...}, {...}, {...}, {...}, {...}, {...}, {...}] 0:{numerocoupon: "0620"} 1:{numerocoupon: "1109"} 2:{numerocoupon: "1441"} 3:{numerocoupon: "2810"} 4:{numerocoupon: "2827"} 5:{numerocoupon: "3141"} 6:{numerocoupon: "3260"} 7:{numerocoupon: "3715"} 8:{numerocoupon: "5104"} 9:{numerocoupon: "5613"} 10:{numerocoupon: "5632"} 11:{numerocoupon: "6037"} length:12 proto:Array(0)

Answer 1

How’s your method of filtering cuponsTotais? Put it on so I can try to help. But basically you need to reset the list. The filter should be done over the list in its initial state.

EDIT

From your code, it is possible to see that the problem is that you are filtering the cuponsTotais and playing on it, ie, vc is changing the value of your source.

The ideal would be a localService or something like that. But to put it simply, let’s say that you’ve received the answer from an API, and you want to filter that result locally, without calling the API again.

You can make a copy of the result when populating cuponsTotais (one of the ways that can be done, to "lose" the original object reference).

this.cuponsFiltrados = JSON.parse(JSON.stringify(this.cuponsTotais));

Use this cuponsFilts to build your list into html. And your filter method would look like this now:

getTopics(ev: any) {
    let serVal = ev.target.value; 
    if (serVal && serVal.trim() != '') { 
        this.cuponsFiltrados = this.cuponsTotais.filter((topic) => { 
            return (topic.numerocupom.indexOf(serVal.toLowerCase()) > -1); 
        }) 
    } else {
        this.resetCupons(); 
    }
}

private resetCupons() {
    this.cuponsFiltrados = JSON.parse(JSON.stringify(this.cuponsTotais));
}

Must solve.

Hugs!