[英]How to format date in Angular Kendo Grid
I working on Angular Kendo Grid and I am getting server data in format我在 Angular Kendo Grid 上工作,我正在以格式获取服务器数据
1900-01-01T00:00:00
But I want it to display in standard format, not sure how to do it.但我希望它以标准格式显示,不知道该怎么做。 I have applied format='{0:MM/dd/yyyy h:mm a}' in grid column but no effect.我在网格列中应用了 format='{0:MM/dd/yyyy h:mm a}' 但没有效果。 What ever data format conversion to do, I need to do at client side of code ie server date to javascript format!!什么数据格式转换要做,我需要在代码的客户端做,即服务器日期到 javascript 格式!
<kendo-grid-column field="mydata.openDate" width="220" title="Open Date" filter="date"
format='{0:MM/dd/yyyy h:mm a}'>
</kendo-grid-column>
Try this: 试试这个:
<kendo-grid-column field="dateField" width="220" title="Open Date">
<ng-template kendoGridCellTemplate let-dataItem>
{{dataItem.dateField | date: 'mm/dd/yyyy'}}
</ng-template>
</kendo-grid-column>
You can also use short or other formats provided by angular Date Pipe 您还可以使用角度日期管道提供的短格式或其他格式
if you have a big project and you have to use the same format multiple times then a directive is the way to go.如果你有一个大项目并且你必须多次使用相同的格式,那么指令就是要走的路。
This is super important for the usability and in case you decided to change the format you use (Maintenance)这对于可用性非常重要,如果您决定更改使用的格式(维护)
import { Directive, OnInit } from '@angular/core';
import { ColumnComponent } from '@progress/kendo-angular-grid';
@Directive({
selector: '[kendo-grid-column-date-format]'
})
export class KendoGridColumnDateFormatDirective implements OnInit {
constructor(private element: ColumnComponent) {
}
ngOnInit() {
this.element.format = "{0:dd.MM.yyyy}";
}
}
and you can use it like this你可以像这样使用它
<kendo-grid-column field="yourField"
title="your title"
kendo-grid-column-date-format>
</kendo-grid-column>
Super important do not forget to register the directive超级重要不要忘记注册指令
The Grid data needs to contain actual JavaScript Date objects as opposed to some string representations. Grid数据需要包含实际的JavaScript Date对象,而不是某些字符串表示。 Then built-in formatting, sorting, filtering and editing will treat the dates as such and will work as expected: 然后内置的格式化,排序,过滤和编辑将处理日期,并将按预期工作:
Map the data so that it contains actual dates. 映射数据以使其包含实际日期。
EXAMPLES: 例子:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.