0

我正在实施ngxDaterangepicker来制作自定义范围,我正在尝试从输入字段更新日期,但dateUpdate事件没有获得最新更新。

这是我在输入字段中所做的更新

这是我在输入字段中所做的更新

这是 dateUpdate 函数的日志,它没有得到改变 这是 dateUpdate 函数的日志,它没有得到改变

这是我的html代码

input
type="text"
ngxDaterangepickerMd
[(ngModel)]="selected"
(rangeClicked)="rangeClicked($event)"
(datesUpdated)="datesUpdated($event)"
[showCustomRangeLabel]="true"
[alwaysShowCalendars]="true"
[ranges]="ranges"
[linkedCalendars]="true"
[showClearButton]="false"
[isInvalidDate] = "isInvalidDate"
[keepCalendarOpeningWithRange]="keepCalendarOpeningWithRange"
[showRangeLabelOnInput]="showRangeLabelOnInput"
/>

在打字稿文件中是代码

export class DateRangeComponent implements OnInit {
selected: any;
alwaysShowCalendars: boolean;
showRangeLabelOnInput: boolean;
keepCalendarOpeningWithRange: boolean;
maxDate: moment.Moment;
minDate: moment.Moment;

ranges: any = {
Today: [moment(), moment()],
Yesterday: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
'This Month': [moment().startOf('month'), moment().endOf('month')],
'Last Month': [
  moment()
    .subtract(1, 'month')
    .startOf('month'),
  moment()
    .subtract(1, 'month')
    .endOf('month'),
 ],
};

isInvalidDate = (m: moment.Moment) => {
  return this.invalidDates.some(d => d.isSame(m, 'day'));
};

constructor() {
 this.maxDate = moment().add(2, 'weeks');
 this.minDate = moment().subtract(3, 'days');

 this.alwaysShowCalendars = true;
 this.keepCalendarOpeningWithRange = true;
 this.showRangeLabelOnInput = true;
 this.selected = {
   startDate: moment().subtract(1, 'days'),
   endDate: moment().subtract(1, 'days'),
 };
}
rangeClicked(range) {
  console.log('[rangeClicked] range is : ', range);
}
datesUpdated(range) {
 console.log('[datesUpdated] range is : ', range);
}
}
4

0 回答 0