如何在Angular5或Javascript中按日期显示数据？

我试图在angular 5应用程序中以日期方式显示数据。 我有uniq日期列表数组和数据数组。我想要下面这样的数据

19/01/2018 

海得拉巴， 钦奈

钦奈， 德里

海得拉巴， 孟买

我喜欢这样

请告诉我怎么做。谢谢

TS:

filterArray:Array=[]；
日期列表=['2018年1月19日'、'2018年1月20日'、'2018年1月21日']；
数据列表=[{
名称：“海得拉巴”，
日期：“2018年1月19日”，
},
{
名称：“钦奈”，
日期：“2018年1月19日”，
},
{
名称：“钦奈”，
日期：“2018年1月20日”，
},
{
名称：“德里”，
日期：“2018年1月20日”，
},
{
名称：“孟买”，
日期：“2018年1月21日”，
},
{
名称：“海得拉巴”，
日期：“2018年1月19日”，
}
];
构造函数（）{
this.getValiDates（）；
}
getValiDates（）{
此.dates\u list.forEach（el=>{
this.filterArray.push（{key:el，data:this.data_list.filter（data=>data.date==el）}）；
})
}

HTML:

{{d.key}}
{{data}json}

您可以做的一件事是将日期转换为时间戳，这样您就可以很容易地比较它们，但可能有一些更好的方法您想要创建一个groupby，请参见，例如，如果有帮助，请投赞成票，以便其他人可以很容易地找到它。

20/01/2018

21/01/2018

dates_list = [19/01/2018, 20/01/2018, 21/01/2018];
data_list = [{
name: "Hyderabad"
date: "19/01/2018",
}, 
{
name: "Chennai"
date: "19/01/2018",
}, 
{
name: "Chennai"
date: "20/01/2018",
},
{
name: "Delhi"
date: "20/01/2018",
},
{
name: "Mumbai"
date: "21/01/2018",
},
{
name: "Hyderabad"
date: "19/01/2018",
}
]

filterdArray: Array<any> = [];

  dates_list = ['19/01/2018', '20/01/2018', '21/01/2018'];
  data_list = [{
    name: "Hyderabad",
    date: "19/01/2018",
  },
  {
    name: "Chennai",
    date: "19/01/2018",
  },
  {
    name: "Chennai",
    date: "20/01/2018",
  },
  {
    name: "Delhi",
    date: "20/01/2018",
  },
  {
    name: "Mumbai",
    date: "21/01/2018",
  },
  {
    name: "Hyderabad",
    date: "19/01/2018",
  }
  ];

  constructor() {
    this.getValiDates();
  }


  getValiDates() {
    this.dates_list.forEach(el => {
      this.filterdArray.push({ key: el, data: this.data_list.filter(data => data.date == el) });
    })
  }

<div *ngFor="let d of filterdArray; let i = index">
    {{d.key}}
    <div *ngFor="let data of d.data">
        {{data | json}}
    </div>
</div>