Umaiz Khan
Umaiz Khan

Reputation: 1227

Ionic Clear data

I am using ion-select to select option and filter it but the issue is when I select one option its filtering fine but when i select second time its filter data from first filter result not from actual data

<ion-item >
     <ion-label style="text-align: right;" dir="rtl" >קטגוריה</ion-label>
        <ion-select dir="rtl" [(ngModel)]="selectedOption" (ionChange)="print()">
           <ion-option *ngFor="let categ of cat2" dir="rtl" [value]="categ.id"  >{{categ.title}}</ion-option>
        </ion-select>
</ion-item> 

print() {

   console.log(this.selectedOption);
   this.data = this.data.filter(category => category.categories[0].id === this.selectedOption);

}

this is just example data

{
{
"title": "111"
"category": "252"
},
{
"title": "111"
"category": "242"
},
{
"title": "111"
"category": "212"
},
{
"title": "111"
"category": "232"
}
}

when i select 232 category its showing 1 array because in data there is only 1 array which have category 232 . but on second time if i click 212 its showing nothing but there is value in data. Its filtering the first filter data.

Any solution how i can solve this ? i know the issue is when i am selecting first value the data is changed. I need when im selecting secodn value it will filter from previous data not from first filter.

Upvotes: 3

Views: 496

Answers (2)

AVJT82
AVJT82

Reputation: 73377

You are filtering the array and assigning it back to the same array, so you are trying to refilter an already filtered array. You should use a helper array when filtering:

filteredData = [];

// ....

print() {
  this.filteredData = this.data.filter(category => category.categories[0].id === this.selectedOption);
}

and then use the helper array to display the filtered values.

Upvotes: 1

Adrita Sharma
Adrita Sharma

Reputation: 22203

This is because you have already filtered the array, so other objects are removed.

Try like this:

this.originalArray = [...this.data];

this.data = this.originalArray.filter(category => category.categories[0].id === this.selectedOption);

Keep the original data in an array originalArray, then you can keep the filtered data from originalArray in array data

Upvotes: 1

Related Questions