import { Component , EventEmitter , Input , Output , ViewChild , } from '@angular/core' ; author Ben Hayward
  @ Component ( { moduleId : module . id , selector : 'm-date-selector' , template : `
    <label class="m-dateSelector__label" *ngIf="label">{{ label }} </label>
    <input
      class="m-dateSelector__input"
      [ngClass]="{ 'm-dateSelector__input--hidden': hideInput }"
      [owlDateTimeTrigger]="dt"
      [owlDateTime]="dt"
      [min]="min"
      [max]="max"
      [ngModel]="date"
      (ngModelChange)="onDateChange($event)"
    />
    <owl-date-time [pickerType]="calendarType" #dt></owl-date-time>
    <m-tooltip
      *ngIf="tooltipIcon"
      icon="{{ tooltipIcon }}"
      [owlDateTimeTrigger]="dt"
    >
      {{ tooltipText }}
    </m-tooltip>
  ` , } ) export class DateSelectorComponent { @ Output ( ) dateChange : EventEmitter < any > = new EventEmitter < any > ( ) ; @ Input ( ) dateFormat : string = 'short' ; @ Input ( ) label : string ; @ Input ( ) hideInput = false ; @ Input ( ) calendarType = 'calendar' ; @ Input ( ) i18n ? : string ; @ Input ( ) tooltipIcon ? : string ; @ Input ( ) tooltipText ? : string ; @ ViewChild ( 'dt' ) dateTimePicker ; protected _date : any ; @ Input ( 'date' ) set date ( value ) { if ( value && value . toString ( ) . length <= 10 ) { value = value * 1000 ; } this . _date = new Date ( value ? value : Date . now ( ) ) ; } get date ( ) { return this . _date ; } protected _min : Date ; @ Input ( 'min' ) set min ( value ) { this . _min = new Date ( value ) ; } get min ( ) : any { return this . _min ; } protected _max : Date ; @ Input ( 'max' ) set max ( value ) { this . _max = new Date ( value ) ; } get max ( ) : any { return this . _max ; } param newDate public onDateChange ( newDate ) { this . dateChange . emit ( newDate ) ; } public open ( e ) { this . dateTimePicker . open ( ) ; } }