Format pipe for columns

I’m submitting a … (check one with “x”)

[ ] bug report => search github for a similar issue or PR before submitting
[X] feature request
[ ] support request => Please do not submit support request here

Current behavior Data must be formatted before being introduced to the table

Expected behavior It would be helpful if we were able to pass in a format string / function to a column for formatting purposes.

What is the motivation / use case for changing the behavior? I have a lot of columns that have dates stored in ISO 8601 format (which is great for data, but not so much for humans), and it would be great if the table could format the data as it’s rendering.

• Table version: 0.7.x 4.1.0

• Angular version: 2.0.x 2.4.1

• Language: [all | TypeScript X.X | ES6/7 | ES5] Typescript

[sincraianul]

@ganeshkantu, you could do something like this:

class DateOnlyPipe extends DatePipe {
  public transform(value): any {
    return super.transform(value, 'MM/dd/y');
  }
}

const columns = [{
  name: 'Date',
  prop: 'dateReported',
  pipe: new DateOnlyPipe('en-US')
}];

[ghost]

@SauceCode84 No magic in the rest of the stuff. Its the standard ngx-datatable template but here you go:

Three things in this code below:

1. To change column names - let-column
2. Formatting cell content (ex: Date) - let-value
3. Formatting with multiple properties Ex: Date - let-row

    <ngx-datatable class="material striped" 
                             [rows]="addresses" 
                            [columnMode]="'force'" 
                            [headerHeight]="50" 
                            [footerHeight]="0" 
                            [rowHeight]="50" 
                            [scrollbarV]="true" 
                            [scrollbarH]="true">
        <ngx-datatable-column prop="createdDate" [width]="120">
            <ng-template let-column="column" ngx-datatable-header-template>
                Since
            </ng-template>
            <ng-template let-value="value" ngx-datatable-cell-template>
                {{value | date: 'MM/dd/yyyy'}}
            </ng-template>
        </ngx-datatable-column>
       <!-- Rest of the columns -->
        <ngx-datatable-column>
            <ng-template let-column="column" ngx-datatable-header-template>
                Location
            </ng-template>
            <ng-template let-row="row" ngx-datatable-cell-template>
                {{row.addressLine1}} {{row.city}},{{row.state}} {{row.zipcode}}
            </ng-template>
        </ngx-datatable-column>
    </ngx-datatable>

Hope this helps.