Filter data from dynamic array values and bring a structure format as output in angular

Question

I am getting dynamic values as array format like this

var sections = [
    { id: "1", section: "I", group: "Section1"},
    { id: "2", section: "I", group: "Section1"},
    { id: "3", section: "I", group: "Section2"},
    { id: "4", section: "I", group: "Section2"},
    { id: "5", section: "II", group: "Section3"},
    { id: "6", section: "III", group: "Section4"},
    { id: "7", section: "IV", group: "Section5"}
];

Output should be in tree structure format like below

I |--- Section1 |--- Section2

II |-- Section3

III |-- Section4

IV |--- Section5

How to do it, I am getting values from Rest API, I am using Angular 8 version, How can we achieve this filter in javascript/typescript

Answer 1

The requirements aren't totally clear (regarding duplicates especially) but here's a solution:

var sections = [
    { id: "1", section: "I", group: "Section1"},
    { id: "2", section: "I", group: "Section1"},
    { id: "3", section: "I", group: "Section2"},
    { id: "4", section: "I", group: "Section2"},
    { id: "5", section: "II", group: "Section3"},
    { id: "6", section: "III", group: "Section4"},
    { id: "7", section: "IV", group: "Section5"}
];

var groupBy = (arr, key) => {
  return arr.reduce(function(rv, x) {
    (rv[x[key]] = rv[x[key]] || []).push(x);
    return rv;
  }, {});
};

var removeDuplicates = (arr) => {
return arr.filter((t,i,s) => i === s.findIndex((_t) => ( _t.group === t.group && _t.section === t.section)) )
}

let resultString = "";

let groupedSections = groupBy(sections, "section")

Object.keys(groupedSections).forEach( key => {
  resultString += key + " |--- " + removeDuplicates(groupedSections[key]).map(s=> s.group).join(" |--- ")  + "\n" 
})

console.log(resultString)

Note that there is probably more efficient/clean way of doing it, but this works fine.

Most of the work was just a matter of finding the right StackOverflow post:

1. Group your array per section here
2. Filter duplicates here

Try to break down your problem next time and search questions that already exist, you'll find that you can fix a lot by just searching and breaking down stuff :)