json - GroupBy date with ionic 2

Question

In this view of the mobile application I need to group the data that are returned by json api group by date !! how to groupby date the data json api with ionic 2 ! In this view of the mobile application I need to group the data that are returned by json api group by date !! how to groupby date the data json api with ionic 2 ! Json API :

course_cheval: [
{
CourseHasCheval: {
id: "1461",
course_id: "460",
cheval_id: "90",
rang: "2",
temps: "TETE",
jockey_id: "30",
poids: "57",
part_jokey: "367.000",
entraineur_id: "6",
part_entraineur: "440.000",
propritaire: "GHARBI. MED",
part_propritaire: "4400.000",
eleveur_id: "47",
part_eleveur: "2200.000"
},
Course: {
id: "460",
date: "2012-06-24",
nom_du_prix: "GODOLPHIN ARABIAN",
allocation: "20000",
hippodrome_id: "2",
jouree: "36",
categorie_id: "1",
distance: "1600",
},
{
CourseHasCheval: {
id: "1412",
course_id: "445",
cheval_id: "90",
rang: "1",
temps: "1.53''8/10",
jockey_id: "3",
poids: "56",
part_jokey: "660.000",
entraineur_id: "6",
part_entraineur: "660.000",
propritaire: "GHARBI. MED",
part_propritaire: "6600.000",
eleveur_id: "47",
part_eleveur: "3300.000"
},
Course: {
id: "445",
date: "2012-10-21",
nom_du_prix: "RIDHA BEN EZZEDINE",
allocation: "12000",
hippodrome_id: "2",
jouree: "49",
categorie_id: "2",
distance: "1600",
nbre_partant: "9",
}
}]

 <ion-grid *ngSwitchCase="'Compteurs'">



   <ion-row *ngFor="let m of members ">
        <ion-col width-20 >
        {{m.Course.date | date : "yyyy"}}
        </ion-col>
        <ion-col width-30>
        {{m.Course.nom_du_prix}}
        </ion-col>
        <ion-col width-20>
            GR.{{m.Course.categorie_id}}
        </ion-col>
        <ion-col width-30>
          {{m.Course.allocation}}
        </ion-col>
   </ion-row>

Answer 1

Your array has some objects without a date property which complicates this slightly so lets start with a simpler example where everything has a date property like so

[
  {
    "name": "Philosophy 212: Ethics and Applications",
    "date": "2007-12-12"
  },
  {
    "name": "JavaScript Fundamentals",
    "date": "2007-12-12"
  },
  {
    "name": "Math 364: Linear Algebra",
    "date": "2017-01-15"
  }
]

We can write a groupByDate function that handles the basic case

function groupByDate<T extends {date: string}>(datedValues: T[]) {
  return datedValues.reduce((groups, dated) => {
    const key = dated.date;
    if (groups[key]) {
      groups[key].push(dated);
    } else {
      groups[key] = [dated];
    }
    return groups;
  }, {} as {[key string]: T[]});
}

Here it is in a snippet (sans types)

var courses = [
  {
    "name": "Philosophy 212: Ethics and Applications",
    "date": "2007-12-12"
  },
  {
    "name": "JavaScript Fundamentals",
    "date": "2007-12-12"
  },
  {
    "name": "Math 364: Linear Algebra",
    "date": "2017-01-15"
  }
];

function groupByDate(datedValues) {
      return datedValues.reduce((groups, dated) => {
        const key = dated.date;
        if (groups[key]) {
          groups[key].push(dated);
        } else {
          groups[key] = [dated];
        }
        return groups;
      }, {});
    }

console.log(groupByDate(courses));