在使用 mat-date-range-picker-actions 之前获取选定的日期值

Question

我有一个日期范围选择器。如何在关闭日历之前获取选定的日期。我尝试了 dateInput、dateChanges，但是如果我的代码中有 mat-date-range-picker-actions，我只能在应用它后才能获取值。单击后立即获取值的任何解决方案

<mat-form-field appearance="fill">
    <mat-label>MAT-LABEL</mat-label>
    <mat-date-range-input
      [rangePicker]="rangePicker">
      <input
        matStartDate/>
      <input
        matEndDate />
    </mat-date-range-input>
    <mat-datepicker-toggle matSuffix [for]="rangePicker"></mat-datepicker-toggle>
    <mat-date-range-picker #rangePicker>
      <mat-date-range-picker-actions>

          <div>
            <button mat-stroked-button color="primary" matDateRangePickerCancel>{{
              cancel
            }}</button>
            <button mat-flat-button color="primary" matDateRangePickerApply>{{
             apply
            }}</button>
          </div>
        </div>
      </mat-date-range-picker-actions>
    </mat-date-range-picker>
  </mat-form-field>

我尝试了日期输入、日期更改。可以工作，没有 mat-date-range-picker-actions，但我需要这部分代码

Answer 1

您缺少模型属性。

您需要添加 ngmodel 指令或表单控件。检查这个例子

https://material.angular.io/components/datepicker/overview#date-range-picker-forms