根据Javascript中数组内对象数组的条件进行过滤

Question

I have this array :

defaultColumnsWithItems = [
{
  column: 'Contrie', items: [
  { id: 1, label: 'USA', selectedItem: true },
  { id: 2, label: 'FRANCE', selectedItem: false  },
  { id: 2, label: 'MAROC', selectedItem: false  }
  ]
},
{
  column: 'Categorie', items:
    [
      { id: 0, label: 'Alimentaion', selectedItem: true },
      { id: 1, label: 'ricolage', selectedItem: false },
      { id: 2, label: 'Literie', selectedItem: true },
      { id: 3, label: 'Menage', selectedItem: false },
    ]
}

];

I want to filter only the elements with selected item withe value equal to true. I try this:

const columnsWithSelectedItems = colmunsWithItemsToFilter.filter((columnWithItems) => {
    return columnWithItems.items.filter( item => item.selectedItem === true)
  })

but it return all elements.

Thank you.

Answer 1

Instead of filter the defaultColumnsWithItems, you should return the whole object with the condition for the items array.

In this scenario, we use the map function to return our object and for items array, we use the filter function to filter selectedItem in each item.

 const defaultColumnsWithItems = [ { column: 'Contrie', items: [ { id: 1, label: 'USA', selectedItem: true }, { id: 2, label: 'FRANCE', selectedItem: false }, { id: 2, label: 'MAROC', selectedItem: false } ] }, { column: 'Categorie', items: [ { id: 0, label: 'Alimentaion', selectedItem: true }, { id: 1, label: 'ricolage', selectedItem: false }, { id: 2, label: 'Literie', selectedItem: true }, { id: 3, label: 'Menage', selectedItem: false }, ] } ] const items = defaultColumnsWithItems.map(el => { return { column: el.column, items: el.items.filter(i => i.selectedItem) } }) console.log('items: ', items);

Answer 2

Try this

defaultColumnsWithItems.map(function(ComparisonResult) {
  ComparisonResult.items = ComparisonResult.items.filter(x => x.selectedItem);
  return ComparisonResult;
});