Reputation: 1227
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
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
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