Angular Material 2 Datepicker 关闭事件未执行 (Angular 4)

Question

我正在使用 Angular Material 2 Datepicker with Angular 4.x - 当我 select 一个日期时，它应该在 datepicker 关闭时发出一个函数（当它关闭时日期是 selected）。我基本上希望能够 select 一个日期而不关闭日期选择器（它应该保留在屏幕上并突出显示 selected 日）

这是基于以下代码，该代码在 stackblitz 上运行良好 - 但由于某种原因在我自己的应用程序中运行不正常？ https://stackblitz.com/edit/angular-ysspzm-ckkrbd

-注意-stackblitz 代码是我遇到的一些通用代码，与我下面的代码不同（尽管几乎相同）

//组件

@Component({
selector: 'app-datepicker',
templateUrl: './datepicker.component.html',
styleUrls: ['./datepicker.component.scss'],
})

export class DatepickerComponent {
@ViewChild('keepOpen') _input: ElementRef;

  _openCalendar(picker: MatDatepicker<Date>) {
      picker.open();
      console.log('here1'); // i see this in the console
  }

  _openCalendarClosed(picker: MatDatepicker<Date>) {
      picker.open();
      console.log('here2'); // never ever see this in the console log??
  }
}

// html

<input
        matInput
        [matDatepicker]="picker"
        placeholder="Choose a date"
        (click)="_openCalendar(picker)"
        #keepOpen>

<mat-datepicker-toggle
        matSuffix
        [for]="picker">
</mat-datepicker-toggle>

<mat-datepicker
        #picker
        class="fixed-open"
        opened="true"
        (closed)="_openCalendarClosed(picker)">
</mat-datepicker>

Answer 1

看起来 material 5.0.0-rc.1 是日期选择器组件能够输出 closed 事件的版本。您提到您正在使用 material 2.0.0-beta.12，因此需要更新以支持此行为。

Angular Material 2 Datepicker 关闭事件未执行 (Angular 4)

Angular Material 2 Datepicker closed event not executed (Angular 4)

javascript

datepicker

angular-material2

angular