Question

我有一个在我的angular2项目中工作的devextreme datagrid。但是，具有日期数据类型的列仅以此格式显示完整的javascript日期：yyyy-MM-ddTHH：mm：ss。我想将此列的格式设置为更加用户友好的格式，如dd.MM.yyyy（欧洲风格）。

但是我设置日期格式的所有尝试直到现在才成功。

以下是迄今为止我在组件模板中的内容：

    <dx-data-grid [dataSource]="tasks">
        <dxi-column dataField="barcode" ></dxi-column>
        <dxi-column dataField="receiptDate" format="shortDate">
            <dxo-format type="shortDate"></dxo-format> 
        </dxi-column>
    </dx-data-grid>

不幸的是，设置格式的类型并没有改变任何东西 - 我仍然得到这个未格式化的JS日期字符串。而且我也没有在控制台中得到任何异常。

Answer 1

上面提到的答案很好，如果你想使用管道（可能是一些额外的格式或任何东西）你可以使用cellTemplate，下面是代码段

    <dx-data-grid [dataSource]="assessments" [height]="gridHeight" [hoverStateEnabled]="true" 
                width="100%">
                <dxi-column dataField="assessDate" dataType="date" [caption]="assessDate" cellTemplate="dateCell"></dxi-column>
                <div *dxTemplate="let cellData of 'dateCell'">
                    {{cellData.value | date: 'dd-MMM-yy'}}
                </div>
            </dx-data-grid>

Answer 2

过了一会儿，我自己找到了答案。问题是您必须将列的dataType属性设置为date - 否则将忽略日期格式化设置。这是有效的：

<dx-data-grid [dataSource]="tasks">
    <dxi-column dataField="barcode" ></dxi-column>
    <dxi-column dataField="receiptDate" dataType="date" format="shortDate"></dxi-column>
</dx-data-grid>

Answer 3

一旦修改了dataType="date"，那么如果您以format="myFormatPipe格式传递，那么devexpress组件就足够聪明，可以从自定义角度管道中捕获格式。
或者您可以简单地执行以下操作：

<dxi-column
  dataField="receiptDate"
  dataType="date"
  format="dd/MM/yyyy"
></dxi-column>

Answer 4

它在1天前显示。下面的变化对我有用 format = dd-MM-yyyy“设为[format] =” {类型：'dd-MM-yyyy'}“

使用角度2在devextreme DataGrid中设置日期列的格式

4 个答案: