It's great when I read an article about a good game like this. It is very well lolbeans written if you can know this. This is a good game that gives us a lot of emotions.

Hello Silvia,

I have been looking into your question and I found that the default date pipe works with mm-dd-yyyy format with both date and string types, that's why in your dd-mm-yyyy format the default date pipe doesn't work and can't format the date to the yyyy-mm-dd.

What I suggest is to create a custom pipe according to your format that takes the value in dd-mm-yyyy and converts it to the format the default pipe works with mm-dd-yyyy then transforms the value into the desired yyyy-mm-dd format. This will be done by creating the DatePipe object in the custom pipe. Then, when this custom pipe is executed, the value will be split by a given separator, then converted to the default format and passed to the transform method of the default pipe object.

@Pipe({

  name: 'dateCustomFormatPipe'

})

export class FilterPipe implements PipeTransform {

  datePipe: DatePipe = new DatePipe('en-US');

  transform(value: any, pattern: string = 'yyyy-MM-dd'): any {

    let arr = value.split('/');

    value = arr[1] + '/' + arr[0] + '/' + arr[2];

    return this.datePipe.transform(value, pattern);

  }

}

After that, the custom pipe will be placed in the template of the column that contains the date in string type. However, this approach only works in the described scenario with the string type of the dates in the column.

<igx-column field="OrderDateString" header="Order Date (string format)" [dataType]="'string'">

      <ng-template igxCell let-cell="cell" let-val>

        {{ val | dateCustomFormatPipe }}

      </ng-template>

    </igx-column>

Here you can find a sample of this approach.

Another approach to achieve the described behavior is to handle the ngAfterViewInit lifecycle hook by accessing the given string date column with the grid's getColumnByName method and looping through all its cells, again will split the value by separator and transform to the given yyyy-mm-dd format.

public ngAfterViewInit() {

        let column = this.grid.getColumnByName('OrderDateString');

        for(let i = 0; i < column.cells.length; i++){

            let arr = column.cells[i].value.split('/');

            column.cells[i].value = arr[2] + '-' + arr[1] + '-' + arr[0];

        }

    }

In addition, I have prepared sample illustrating this approach which could be found here.

If you require any further assistance on the matter, please let me know.

Regards,

Georgi Anastasov

Entry Level Software Developer

Infragistics