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

Question

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

这是我在 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

Answer 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) { }

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

how to send fullcalendar day click date to other component in Angular5

javascript

fullcalendar

angular-material

angular

angular5