在Angular中选择一个日期时如何向Bootstrap DatePicker添加一天答案

【问题标题】：How to add one day to Bootstrap DatePicker when one date is pick in Angular在Angular中选择一个日期时如何向Bootstrap DatePicker添加一天
【发布时间】：2021-12-31 19:19:39
【问题描述】：

开发者好，我有两个输入 boostrap 日期选择器供用户选择，如果选择了第一个日期字段，我希望下一个日期字段应该从一天开始，加上最初在第一个日期字段上选择的开始日期。这是我的第一个输入字段：

<input
  (blur)="setMinDate($event)"
  id="StartTime"
  type="text"
  name="StartTime"
  class="form-control"
  bsDatepicker
  datePickerLuxonModifier
  [(date)]="userFirstInput.startTime"
  [(ngModel)]="userFirstInput.startTime"
  [maxDate]="userFirstInput.endTime"
  [minDate]="startdate"
  [bsConfig]="{ adaptivePosition: true }"
  required
/>

这是第二个输入字段：

<input
  id="EndTime"
  type="text"
  name="EndTime"
  class="form-control"
  bsDatepicker
  datePickerLuxonModifier
  [(date)]="userSecondInput.endTime"
  [(ngModel)]="userSecondInput.endTime"
  [minDate]="minPickDate"
  [bsConfig]="{ adaptivePosition: true }"
  required
/>

该函数应用于第一个日期输入，以存储获取第一个输入日期的日期选择并为其添加一天，这将用作第二个输入日期字段的 [minDate]：

minPickDate: DateTime;
    
setMinDate(event){
  this.minPickDate = this.userFirstInput.startTime.plus({days:1});
}

但不起作用，我尝试使用 ngModelChange 和 Change 事件，但仍然没有成功。 我需要帮助。

【问题讨论】：

标签： javascript angular typescript datepicker bootstrap-datepicker

【解决方案1】：

尝试下面使用bsValueChange，希望对你有用

<input
  (bsValueChange)="setMinDate($event)"
  id="StartTime"
  type="text"
  name="StartTime"
  class="form-control"
  bsDatepicker
  datePickerLuxonModifier
  [(date)]="userFirstInput.startTime"
  [(ngModel)]="userFirstInput.startTime"
  [maxDate]="userFirstInput.endTime"
  [minDate]="startdate"
  [bsConfig]="{ adaptivePosition: true }"
  (bsValueChange)= "setMinDate($event)"
  required />

ts minPickDate : 日期;

 setMinDate(value){
    var nextDay = new Date(value);
    nextDay.setDate(nextDay.getDate() + 1);
    this.minPickDate = nextDay;
 }

【讨论】：

它工作，谢谢你的帮助。我很感激。