如何将完整日历日点击日期发送到Angular 5中的另一个组件答案

【问题标题】：how to send fullcalendar day click date to other component in Angular5如何将完整日历日点击日期发送到Angular 5中的另一个组件
【发布时间】：2023-03-19 02:45:02
【问题描述】：

我正在尝试将日期发送到对话框（用于注册新事件）。

这就是我在 CalendarOptions 中添加的方式，

 calendarOptions = {
        header:
          {
            left: 'prev,next,today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay,listMonth'
          },

        dayClick: (function (date, jsEvent, view) {
          let events$: Observable<Event[]> = this.store.select(fromAgenda.getAllEvents);
          this.onDayClicked.emit(events$);
        })
}

&当我点击日历上的任何一天时，我的其他组件已经提到，它将打开 dailog 进行事件注册，如下所示，

 onDayClicked(event) {  
    let dialogRef = this.dialog.open(EventNewComponent, {
    width: '750px'
  });

  dialogRef.afterClosed().subscribe(result => {    
   this.store.dispatch(new eventsActions.LoadAll());    
  });
  }

& 它正在打开如下对话框，

如何在对话框中获取点击日期作为开始日期？ EventNewComponent

【问题讨论】：

material.angular.io/components/dialog/overview "与 Dialog 组件共享数据。"

标签： javascript angular angular-material angular5 fullcalendar

【解决方案1】：

我终于找到了答案。

 dayClick: (function (date, jsEvent, view) {
        let dialogRef = this.dialog.open(EventNewComponent, {
          width: '750px',        
          data: {
            dataKey: date._d
          }
        });      
   })

& 你可以使用下面的构造函数在其他组件中访问它，

constructor( @Inject(MAT_DIALOG_DATA) public data: any) { }

如果您的日期是可选的，

constructor( @Optional() @Inject(MAT_DIALOG_DATA) public data: any) { }

【讨论】：