Я хотел добавить компонент datetimepicker
к компоненту ng2-smart-table. Все, что я могу сейчас сделать, это добавить datepicker
, но я также хочу добавить время к этому.
Я пробовал с некоторым компонентом owl-date-time. но это портит все окно.
HTML-файл
<div class="input-group">
<span [owlDateTimeTrigger]="dt" class="input-group-addon"><i class="fa fa-calendar"></i></span>
<input
[owlDateTimeTrigger]="dt" [owlDateTime]="dt"
[(ngModel)]="inputModel"
placeholder="{{placeholder}}"
[min]='min' [max]='max'
readonly
class="form-control">
</div>
<owl-date-time #dt [stepMinute]="15" [hour12Timer]='true' (afterPickerClosed)="onChange()"></owl-date-time>
**.ts file**
@Input() placeholder: string = 'Choose a Date/Time';
@Input() min: Date; // Defaults to now(rounded down to the nearest 15 minute mark)
@Input() max: Date; // Defaults to 1 month after the min
stringValue;
inputModel: Date;
constructor() {
super();
}
ngOnInit() {
if(!this.min) {
this.min = new Date();
this.min.setMinutes(Math.floor(this.min.getMinutes() / 15) * 15 );
}
if(!this.max) {
this.max = new Date(this.min);
this.max.setFullYear(this.min.getFullYear() + 1);
}
if(this.cell.newValue) {
let cellValue = new Date(this.cell.newValue);
if(cellValue.getTime() >= this.min.getTime() && cellValue.getTime() <= this.max.getTime()) {
this.inputModel = cellValue;
this.cell.newValue = this.inputModel.toISOString();
}
}
if(!this.inputModel) {
this.inputModel = this.min;
this.cell.newValue = this.inputModel.toISOString();
}
}
onChange() {
if(this.inputModel) {
this.cell.newValue = this.inputModel.toISOString();
}
}
}
@Component({
template: `{{value | date:'short'}}`,
})
export class SmartTableDatepickerRenderComponent implements ViewCell, OnInit {
@Input() value: string;
@Input() rowData: any;
constructor() { }
ngOnInit() { }
Я хочу, чтобы средство выбора даты-времени в ng2-smart-table выбирало дату ивремя суток.