有没有办法知道 mat-datepicker 弹出窗口已关闭，因为单击日期

Question

我想在 mat-datepicker 弹出窗口关闭时执行一些操作，但前提是用户单击日期（如果弹出窗口通过退出键或背景点击关闭，则不应触发操作）。

我知道有一个@Output('closed') closedStream: EventEmitter<void>，但每次弹出窗口关闭时都会触发它。 我的想法是检测打开和关闭事件之间是否存在 dateChange 事件，但如果用户单击已选择的日期，则该事件不起作用。

我尝试使用自定义 DateAdapter 解决此问题（覆盖 sameDate 或 compareDate 方法以返回所选日期总是与当前选择的日期不同）但似乎 mat-month-view 组件没有使用 DateAdapter 来比较之前的日期发出选择更改：

_dateSelected(date: number) {
    if (this._selectedDate != date) {
      const selectedYear = this._dateAdapter.getYear(this.activeDate);
      const selectedMonth = this._dateAdapter.getMonth(this.activeDate);
      const selectedDate = this._dateAdapter.createDate(selectedYear, selectedMonth, date);

      this.selectedChange.emit(selectedDate);
    }

    this._userSelection.emit();
}

不确定这本身是否是一个错误......

有没有人知道一种更简单的方法来了解材料日期选择器弹出窗口是否由于日期选择而关闭？我错过了什么明显的东西吗？

谢谢！

Answer 1

如果您想知道某些更改是使用 [ngModel] + (ngModelChange) 还是 formControl，我认为该方法

  <input matInput [ngModel]="date" (ngModelChange)="change($event)"
        [matDatepicker]="picker" placeholder="Choose a date">
  //in .ts
  date:any;
  change(date:any)
  {
    this.date=date;
    console.log("change")
  }

或

  <input matInput [formControl]="formControl" [matDatepicker]="picker2" 
           placeholder="Choose a date">
   //in .ts
  formControl:FormControl=new FormControl()
  ngOnInit()
  {
    this.formControl.valueChanges.subscribe(res=>{
      console.log("change formControl")
    })
  }

查看simple stackblitz