选择日期时如何保持日期选择器打开？

Question

我有一个使用 Angular Material Datepicker 的 Angular 4.x 应用程序（package.json 将其显示为 "@angular/material": "^2.0.0-beta.12"） - 我的工作正常，但是我需要能够选择日期并保持日期选择器打开 -此功能在 Angular Material (v5.0.0) 的以下版本中可用，但这也意味着将我们的 Angular 本身版本从 4 升级到 5（我们目前无法做到这一点）

我如何修改代码以允许我 a) 即使选择了日期也保持打开日期选择器或 b) 选择日期后立即重新打开日期选择器 - 是否可以使用这个旧版本的材料

https://stackblitz.com/edit/angular-ysspzm-bz2ezu?file=app/datepicker-overview-example.ts

// HTML 组件

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

<mat-datepicker
        #picker
        class="fixed-open"
        opened="true">
</mat-datepicker>

// 自定义日期选择器组件 此处添加了导入...

@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();
  }
}

// node_modules 目录中的datepicker.d.ts（我在 pastebin 链接中使用下面的代码） https://pastebin.com/ChYBmpU6

Answer 1

这似乎适用于日期更改，您可以将其重构为您需要的任何事件类型。

组件

 @ViewChild('picker') picker;

  _openCalendar() {
   setTimeout(()=>this.picker.open());
  }

HTML

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