Angular Kendo UI Grid DateTime format in yyyy/MM/dd from the Epoch time

Question

I am using Kendo UI Grid with Angular 6 and getting data from API where datetime is coming in Epoch format like below :

x.items[0].EffectiveDate.$date = 1550719967

i am using below html for kendo grid column and Sort should work as well. I have gone through the this and this Link but didn't solved the issue.

If anyone have face this kind of scenario please help me to figure it out. Thanks in Advance.

<kendo-grid-column field="EffectiveDate" title="Effective Date" filter="date" format="{0:dd/MM/yyyy HH:mm:ss }" [style]="{'text-align': 'left'}" width="130">
 <ng-template kendoGridCellTemplate let-dataItem>
    {{ dataItem.EffectiveDate?.$date | date:'dd/MM/yyyy HH:mm:ss'}}
</ng-template> </kendo-grid-column>

Kuldeep · Answer 1 · 2019-02-20T17:18:11.717

0

You have typo mistake in

x.items[0].EffectiveDate.$date = 15159I4400000

this value contains an I i.e. 15159'I'4400000

Try with 1515914400000

edited Feb 20 '19 at 17:18

answered Feb 19 '19 at 18:27

Kuldeep

74
4

i have tried like this {{ dataItem.FirstOrderedOn | date:'dd/MM/yyyy HH:mm:ss'}} and it is showing me 19/01/1970 04:13:55.with every Epoch time it is taking 19/01/1970.with different date format also it is taking 1970. – Abhishek Kumar Seth Feb 20 '19 at 16:58
[plunker](https://plnkr.co/edit/96WkJnofxjiHV6GmaZjj?p=preview), is having a example where i am trying to change the datasource datetime as epoch time – Abhishek Kumar Seth Feb 20 '19 at 17:00
Hey @AbhishekKumarSeth I have updated my answer. Please try in this way to resolve your issue. – Kuldeep Feb 20 '19 at 17:19
Thanks for your response. I have tried your approach but it was not working.(I have updated my question with correct Epoch time). it was always giving me the 19/01/1970. But now i am able to format it to convert epoch time to date. i am inserting the code snippet in the next answer section. – Abhishek Kumar Seth Mar 01 '19 at 12:07

score 0 · Answer 2 · answered Mar 01 '19 at 12:08

 <kendo-grid-column field="EffectiveDate" title="Effective Date" filter="date" format="{0:dd/MM/yyyy HH:mm:ss }" [style]="{'text-align': 'left'}"
width="130">
<ng-template kendoGridCellTemplate let-dataItem>
  {{ getdateformat(dataItem.EffectiveDate.$date | date:'dd/MM/yyyy HH:mm:ss'}}
</ng-template>

getdateformat(utcSeconds){
if (utcSeconds == null || utcSeconds == "" || utcSeconds == undefined){
  return "";
}
var d = new Date(0); // The 0 there is the key, which sets the date to the epoch
d.setUTCSeconds(utcSeconds);
return d;
}

reference to convert epoch to date

Angular Kendo UI Grid DateTime format in yyyy/MM/dd from the Epoch time

2 Answers2