datatable and date

[manang85]

Hi all,
I have a table with two rows in date format.
as input the server sends me a datatime (milliseconds from 1970).
I want to show the date as dd/mm/yyyy. How I can do this conversion?
thank you very much.
Angelo

[MarkL]

You can use the angular 2 date pipe

[manang85]

I tried like this code:

Code: Select all

 <p-column field="earliestTimeStamp | date : 'dd/MM/yy HH:mm:ss'" header="Earliest Time Stamp" [sortable]="true">

but I don't see nothing.


I tried with this code:

Code: Select all

 <p-column field="lastTimeStamp" header="Last Time Stamp" [sortable]="true">
                <template let-col let-lastTimeStamp="rowData">
                    {{lastTimeStamp[col.field] | date : "dd/MM/yy HH:mm:ss"}} 
                </template>
            </p-column>

but I have a problem with template for the row expansion.
Thank you for the help.

Angelo

[cagatay.civici]

Try to put the row expansion template before the p-column elements.

[manang85]

Thank you @Optimus.prime.
I put the expansion template immediately after the column with the arrow to open the template..

Maybe an id of template where I can define "with this column I'm referring to this template" could be a better idea.

Thank you very much
Angelo

[kalininadev]

Thank you @Optimus.prime.
I put the expansion template immediately after the column with the arrow to open the template..

Maybe an id of template where I can define "with this column I'm referring to this template" could be a better idea.

Thank you very much
Angelo

@manang85, hello! Have you solved the problem? Could you please share the solution?

[manang85]

Code: Select all

<p-dataTable [value]="vRepWInstances" selectionMode="single" [(selection)]="selectedVRepWInstance"  [paginator]="true" [rows]="10" [responsive]="true" expandableRows="true">
            <p-column expander="true" styleClass="col-icon"></p-column>
            <template let-col let-vRepWInstances="rowData">
                <div class="ui-grid ui-grid-responsive ui-fluid" style="font-size:16px;padding:20px">
                    <div class="ui-grid-row">
                      <div class="ui-grid-col-7">
                            <div class="ui-grid ui-grid-responsive ui-grid-pad">
                                <div class="ui-grid-row">
                                    <div class="ui-grid-col-2 label">Destination End Point: </div>
                                    <div class="ui-grid-col-10">{{vRepWInstance.flowName}}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </template>
            <p-column field="flowName" header="Flow Name" [sortable]="true"></p-column>
            <p-column field="fileId" header="File ID" [sortable]="true"></p-column>
            <p-column field="sourceApplication" header="Source Application" [sortable]="true"></p-column>
            <p-column field="destinationApplication" header="Destination Application" [sortable]="true"></p-column>
            <p-column field="fileSize" header="File Size" [sortable]="true"></p-column>
           
            <p-column field="earliestTimeStamp" header="Earliest Time Stamp" [sortable]="true">
               <template let-col let-earliestTimeStamp="rowData">
                    {{earliestTimeStamp[col.field] | date : "dd/MM/yy HH:mm:ss"}} 
                </template>
            </p-column>
</p-dataTable>

I hope you understand the code...
bye
Angelo