1

我想在 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();
}

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

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

谢谢！

4

1 回答 1

0

我认为如果您想知道某些更改是使用 [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")
    })
  }

看一个简单的 stackblitz

于 2019-12-14T14:15:54.553 回答