如何使用 angular 从 bootstrap 日期选择器输入中获取值 7

Question

我正在使用 angular 7 和 bootstrap 4 进行编码。我使用 bootstrap 日期选择器来 select 日期并尝试从中获取数据。

我的 html 代码是这样的：

<div class="col-lg-8 form-group">
      <input id="startDate" type="text" placeholder="From" 
      class="form-control" bsDatepicker
      [bsConfig]="{ adaptivePosition: true, 
      dateInputFormat:'YYYY-MM-DD'}" (change)="onDateSelect($event)" >
</div>

而 JavaScript 函数是：

 selectedStartDate: string;
 onDateSelect(event) {
     this.selectedStartDate = event.target.value;
     console.log(this.selectedStartDate)
   }

结果我得到 "undefined"。

selectedStartDate = undefined

谁能帮我从 bootstrap 日期选择器中获取 selected 日期的值？

Answer 1

<div class="col-lg-8 form-group">
      <input id="startDate" type="text" placeholder="From" 
      class="form-control" bsDatepicker [(ngModel)]="selectedStartDate"
      [bsConfig]="{ adaptivePosition: true, 
      dateInputFormat:'YYYY-MM-DD'}" >
</div>

你将在 "selectedStartDate"

有约会

Answer 2

您可以使用 ngModel 属性 和 ngModelChange 函数。

例如更改您的 html

<input id="startDate" type="text" placeholder="From" 
      class="form-control" bsDatepicker [(ngModel)]="selectedStartDate"
      [bsConfig]="{ adaptivePosition: true, 
      dateInputFormat:'YYYY-MM-DD'}" (ngModelChange)="updateMyDate($event)" >

和ts文件

updateMyDate(newDate) {
    console.log(newDate);
}