我在angular8应用程序中使用了bootstarp 4 datetimepicker。在这里,我正在获取所有3个字段的最新日期,但是我必须获取我给该特定字段的日期。我使用过ngModel,是否基于该问题?
TS:
dateRestriction(event, restriction) {
$(".onlyDateTime").datetimepicker();
$(".onlyDate").datetimepicker({ format: "L" });
$(".onlyDateTime")
.datetimepicker()
.on("dp.change", e => {
const date = e.date;
console.log(e.date.format("L"));
this.Restrictions[restriction].datetime = e.date.format("L");
});
}
HTML:
<div class="col-6 {{isReadOnly ? 'link-disabled' : ''}}"
*ngFor="let restrictValue of Restrictions;let i = index">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="{{restrictValue.id}}"
[checked]="restrictValue.boolValue" (change)="restrictValue.boolValue = $event.target.checked"
>
<label class="custom-control-label" for="{{restrictValue.id}}">{{restrictValue.label}}</label>
</div>
<div class="form-group">
<input type="text" class="form-control onlyDateTime" placeholder="MM/DD/YYYY HH:MM AM/PM"
[disabled]="!restrictValue.boolValue" [(ngModel)]="restrictValue.datetime" (change)="dateRestriction($event,restrictValue)" (click)="dateRestriction($event, i)"
[ngModelOptions]="{standalone: true}" >
</div>
</div>
由于您将Jquery日期选择器更改事件用于datetimepicker。在日期选择器的单击事件之前被调用。
尝试一下
ngAfterViewInit() {
$(".onlyDate").datetimepicker({ format: "L" });
let dat = null;
$(".onlyDate")
.datetimepicker()
.on("dp.hide", e => {
const date = e.date;
let dat = e.date.format("L");
this.Restrictions[this.selectedIndex].datetime = dat;
});
}
dateRestriction( i) {
this.selectedIndex = i;
}