Angular Kendo Column Date Formatter

column-date-format.directive.ts

import { Directive, OnInit, Input } from '@angular/core';
import { ColumnComponent } from '@progress/kendo-angular-grid';

// Usage:
//
// <kendo-grid-column field="fieldname" title="Field Title" kendo-column-date-format="dd/MM/yyyy"></kendo-grid-column>
//
@Directive({
  selector: '[kendo-column-date-format]'
})
export class ColumnDateFormatDirective implements OnInit{

  @Input('kendo-column-date-format')
  kendoColumnDateFormat : string | undefined;

  constructor(private element: ColumnComponent) { }

  ngOnInit() {
    if (this.kendoColumnDateFormat !== undefined) {
      this.element.format = `{0:${this.kendoColumnDateFormat}}`;
    }
  }

}