Angular 角度材质日期范围选择器设置默认值

我正试图根据从日历事件中获取的值设置日期选择器打开的默认月份。 例如：你在四月，你点击日历上的下一个月，当你选择日期选择器时，它会在五月打开

我环顾四周，很多问题都讨论了日期选择器，但没有讨论范围选择器。通常（据我所知）解决方法是：

//将[Value]绑定添加到输入并设置值
例如

mat日期范围输入没有[Value]属性

因此，我不知道如何在范围选择器上设置“默认值：

<mat-form-field appearance="fill">
  <mat-label>Click the Icon to select a Date</mat-label>
  <mat-date-range-input [formGroup]="range" >
       <input matStartDate formControlName="start" placeholder="Start date">
       <input matEndDate formControlName="end" placeholder="End date">
  </mat-date-range-input>
       <mat-datepicker-toggle matSuffix [for]="dateRangePicker"></mat-datepicker-toggle>
       <mat-date-range-picker  #dateRangePicker></mat-date-range-picker>
                  
      <mat-error *ngIf="range.controls.start.hasError('matStartDateInvalid')">Invalid start date</mat-error>
      <mat-error *ngIf="range.controls.end.hasError('matEndDateInvalid')">Invalid end date</mat-error>
</mat-form-field>

单击图标以选择日期
无效的开始日期
无效的结束日期

日期选择器：

我找到的解决方案是如何设置普通的单一日期选择器：

注：我使用的是范围选择器，因此我的输入字段与普通的基本日期选择器不同。因此我无法使用[Value]绑定以相同的方式进行绑定

ShortVersion：我想绑定到mat日期范围输入，以设置它开始的默认月份

---

它只是给FormControls赋值——如果您使用formGroups，而不是value，例如

  this.range = new FormGroup({
      start: new FormControl(new Date(2021, 1, 15)),
      end: new FormControl(new Date(2021, 2, 16))
    });

---

从你描述的情况来看，问题似乎是日期的索引从0开始，也就是说，如果你一个月超过1，那么它是2月而不是1月，依此类推，因为1月是1。你能创造一个小提琴，让我们可以尝试我描述的理论吗？我想我当时可能解释得有点奇怪，本质上问题是Material中的默认日期选择器有一个[Value]绑定，你可以在输入上分配，你可以从那里设置值，所以我的计划实际上只是传递每次抛出的值，但我没有办法绑定到“default”“在范围选择器上的值，我将分享来自材料本身的原始小提琴，因为我的问题更多地与defualt Datepicker相关，然后是如何从我的值分配。有趣的小怪癖是，当我添加日期时，它实际上设置了默认值，但我得到了：试图在没有关联输入的情况下打开MatDatepicker。尝试打开日历时出错抱歉，我不明白您的意思，如果您想显示月份，请使用mat日期范围选择器的属性startAt，例如

，如果您不想使用FormGroup，则可以在输入中使用两个变量[value]：

（请记住，变量必须是Date javascript Objects抱歉解释得太不清楚，将起始值与范围formGroup 100%绑定，我错误地删除了输入上的选择器：[rangePicker]=“Date rangePicker”，因此它找不到选择器。我最终使用了你的[startAt]建议非常有效，我只想在答案中添加

，谢谢你，太好了！请在你的答案中添加一些解释，以便其他人可以从中学习

  this.range = new FormGroup({
      start: new FormControl(new Date(2021, 1, 15)),
      end: new FormControl(new Date(2021, 2, 16))
    });

fb stands for formbuilder.

this.userFrm = this.fb.group({
      date: [new Date('Date format')]
})