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

我有一個devextreme datagrid工作在我的angular2項目中。但是，具有日期數據類型的列僅以此格式顯示完整的javascript日期：yyyy-MM-ddTHH：mm：ss。我想將此列的格式設置爲更像dd.MM.yyyy（歐式）的用戶友好型。使用角度2設置devextreme DataGrid中日期列的格式

但是，直到現在，我所有設置日期格式的嘗試都沒有成功。

下面是我有分量模板直到如今

<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日期字符串。我也沒有在控制檯中發現任何異常。

來源

2017-05-18 marco birchler

我完全不熟悉devexpress，但是你可能不會使用[angular date pipe]（https://angular.io/docs/ts/latest/api/common/index/DatePipe-pipe.html ）爲：'[dataField] =「receiptDate | date：'short'」'？ – Und3rTow

@ und3rTow感謝您的輸入 - 不幸的是，此時管道無效 - 但我已經找到了解決方案 –

我在一段時間後自己找到答案。問題是你必須設置列的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>

來源

2017-05-18 15:07:40

，如果你想使用管道（可能是一些addditional格式或任何東西），你可以使用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>

來源

2017-06-13 00:33:45

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

回答

相關問題