javascript - 选择日期时，如何让日期选择器保持打开状态？

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) 在选择日期后立即重新打开日期选择器 - 这是否可能使用这个 Material 的旧版本

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>