Sorting an Array of JSON objects by date - Angular2

Question

I am trying to sort an array of objects in Angular2. The best way to explain is to give code examples:

var activity =  {
            SEQ_NO: -1,
            SIGNUP_NAME: "Testing Activity",
            SHORT_DESCRIPTION: "This activity min: 2, max: 25",
            EVENT_BEGIN_DATE: "2018/09/25",
            EVENT_END_DATE: "2018/09/25"
           };

The array is filled with objects like seen above. My goal is to take the array and sort it based on the date. I also call a convert date function that takes the numeric date and turns it to a readable format:

convertDate(incomingDate) {
    var myDate = new Date(incomingDate);
   var days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
   console.log(days[myDate.getDay()]);
   var date = days[myDate.getDay()]+" "+(myDate.getMonth()+1)+'/'+myDate.getDate()+'/'+myDate.getFullYear();
    //alert(date);
   return date;
  }

So the activity object shown in this example will convert to: Tuesday 9/25/2018

How can I sort an array of these objects by date? When I display them, I am wanting to display them in order of months.

Thanks everyone in advanced.

Can you sort it before converting (convert after sorting)? If you were to do that it would already be in a sortable format and you would only need to use .sort() on the key. — Froast, Oct 24 '17 at 01:01
It can sort at any point. I just provided the converting portion in case it might be easier! — Austin Hunter, Oct 24 '17 at 01:02
Do you want to convert by begin date or end date? Ascending or descending order? — Froast, Oct 24 '17 at 01:12

score 1 · Accepted Answer · answered Oct 24 '17 at 01:19

1

When a string date is in the format yyyy/mm/dd it can be properly sorted without converting.

list.sort(function (a, b) {
  a = a.EVENT_BEGIN_DATE;
  b = b.EVENT_BEGIN_DATE;
  if (a < b) {
    return -1;
  } else if (a > b) {
    return 1;
  }
  return 0;
});

You can then convert the dates.

answered Oct 24 '17 at 01:19

Froast

742
8
16

Though technically correct assuming the format yyyy/mm/dd, string comparison is a bad idea. For example, if another person reading this was not using leading zeros: `'2018/10/17' > '2018/2/17' // false`. Better to work with `Date` or a date library. – stealththeninja Oct 24 '17 at 03:00
@stealththeninja True, and now that I think about it at some point the string will be a date anyways so at one step it can be used to sort and at the next it can be converted to the human readable string if need be. – Froast Oct 24 '17 at 05:10

Philip Brack · Answer 2 · 2017-10-24T01:18:35.197

First I would convert your date to a unix time as those will already be sorted by month.

Second I would simply just sort your array by that number.

Since you are using typescript.

component.html

 <div *ngFor="let sorted of sortedArray$ | async">
    {{sorted.start}} 
 </div>

component.ts

  list: any[] = [{
    start: '2018/09/25',
    content: 'second'
  },{
    start: '2018/08/10',
    content: 'first'
  }];

  sortedArray$: Observable<any[]>;

  constructor(public navCtrl: NavController) {
    this.sortedArray$ = Observable.of(this.list)
    .map((data) => {
        data.sort((a, b) => {
            return new Date(a.start.getTime()) > new Date(b.start.getTime());
        });
        return data;
    });
  }

Sorting an Array of JSON objects by date - Angular2

2 Answers2