如何重置为默认值 bsDateRangePicker

Question

我正在尝试使用 Angular 9 创建响应式表单。我还使用 ngx-bootstrap

我正在尝试使用 daterangepicker，当我使用 form.reset() 函数时，函数会清除输入字段。但我只想将它重置为默认值。

页面加载时，它显示默认值。但是如果我重置它，它不会。

这是我的 html 文件：

<form id="myForm" [formGroup]="myForm" class="form-group p-2">
<div class="input-group ">
<input value="null" type="text" 
       class="form-control" formControlName="dateRange"                                         
       #dp="bsDaterangepicker" bsDaterangepicker 
       [bsConfig]="{ rangeInputFormat : 'DD.MM.YYYY, HH:mm:ss', dateInputFormat: 'DD.MM.YY, 
       HH:mm:ss',showWeekNumbers: false, isAnimated: true, containerClass: 'theme-blue' } ">
</div>
<button type="button" (click)="clearAllForms()" class="btn btn-danger">Clear</button>
</form>

和 ts 文件：

this.myForm = this.formBuilder.group({
      dateRange: new FormControl([
        new Date(this.currentDate.setDate(this.currentDate.getDate() - 7)),
        new Date()
      ])})

clearAllForms(){
     myForm.reset()
}

如何将其重置为默认值。这可能吗？

提前致谢

Answer 1

将所需的默认值（此处为 Date 对象数组）作为 reset 方法内的映射传递，其中键是表单控件名称，值是控件的值。

clearAllForms(){
  this.myForm.reset({
    dateRange: [new Date(), new Date()]
  });
}

如何重置为默认值 bsDateRangePicker

How to reset to default value bsDateRangePicker

angular

typescript

ngx-bootstrap

angular-reactive-forms