Set the format of a date column in devextreme DataGrid with angular 2

user_1105488 0
Viewed 15589

I have a devextreme datagrid working in my angular2 project. However a column with a date datatype just shows the full javascript date in this format: yyyy-MM-ddTHH:mm:ss. I would like to set the format for this column to something more user friendly like dd.MM.yyyy (european style).

But all my attempts to set the format of the date were not successful until now.

Below is what I have in the component template until now:

    <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>

Unfortunately setting the type of the format doesn't change anything at all - I still get this unformated JS date string. And I also don't get any exception in the console.

devextreme angular typescript devexpress
4 Answers
  • once you modified dataType="date", then devexpress components are smart enough to catch format from your custom angular pipe if you passed as a format format="myFormatPipe .
  • or you can simply do this you can do this:
<dxi-column
  dataField="receiptDate"
  dataType="date"
  format="dd/MM/yyyy"
></dxi-column>
user_65125650

It was showing 1 day before. Below changes worked for me format=dd-MM-yyyy" To [format]="{ type: 'dd-MM-yyyy' }"

user_93281170
Related