fullcalendar单击日期编号可打开不在日期单元格上的项目列表

Question

我在角度2应用程序中使用完整日历。 fullcalendar会在单击日期单元格或日期编号时打开一个列表。我正在寻找 - 如果用户点击日期单元格中的日期链接，它应该打开该日期的项目列表（向下钻取）。 如果用户点击日期单元格中空白区域中的任意位置，则不任何点击事件和操作。目前我正在使用onDayClick事件处理程序，是否有任何其他事件处理程序只处理日期点击，如果没有任何方法来实现这一点。

html -

     <p-schedule [events]="events" 
          [eventLimit] ="3"    (onViewRender)="loadEvents($event)"
          [eventRender]="eventRender" 
         (onEventClick)="handleEventClick($event)" 
          (navLinkDayClick)="handleDayClick($event)">
        </p-schedule>

component.ts

    import { OnInit, Component, ViewChild, Renderer, ElementRef, Input } from '@angular/core';
import * as moment from 'moment';
import { UserService } from '../../app.component.service'
declare let $: any;

@Component({
  selector: 'app-calendar',
  providers: [UserService],
  templateUrl: './calendar.component.html',
  styleUrls: ['./calendar.component.css']
})
export class CalendarComponent implements OnInit {

  @Input() calendarData: any;
  @Input() calendarInfo: any;
  eventsData: any;

  newEvents: any;
  events: any;
  calendarEvents: any;
  header: any;
  calendarTitle: string;
  eventField: any;
  eventsInfo: any;
  newEventsInfo: any;
  calendarTitleJql: string;
  constructor(private userService: UserService) {  }



  ngOnInit() {
    this.calendarTitle = this.calendarInfo.Name;
    this.calendarTitleJql = this.calendarInfo.jql;
    if (this.calendarData[0]) {
      this.eventField = Object.keys(this.calendarData[0])[6];
    }

    this.eventsInfo = JSON.parse(JSON.stringify(this.calendarData).split(this.eventField).join('eventDate'));

    this.events = this.eventsInfo.map(function (_ref) {
      var Status = _ref.Status,
        eventDate = _ref.eventDate,
        Created = _ref.Created,
        Key = _ref.Key;
      return { title: Status, start: eventDate, id: Key, tooltip: Status }; 
    });  



  }


  handleEventClick(e) {
    this.userService.showTicket(e.calEvent.id);
  }
  calendarTitleClick() {
    this.userService.search(this.calendarTitleJql);
  }



  loadEvents(e) {



    if (this) {
      let month = e.view.start._d.getMonth() + 2; 
      let year = e.view.start._d.getFullYear();  

      if (month == '13') {
        month = 1;
        year = year + 1;

      }

      this.userService.getGadgetsData(this.calendarInfo.id, "Calendar", month, year).subscribe(gadgetsData => {
        if (gadgetsData.Data.Issues[0]) {
          this.eventField = gadgetsData.Data.Issues[0].Values[5].Key;

        } 
        this.newEvents = gadgetsData.Data.Issues.map(function (o) {
          return o.Values.reduce(function (acc, _ref) {
            var Key = _ref.Key,
              Value = _ref.Value;
            return acc[Key] = Value, acc;
          }, {});
        });

        this.newEventsInfo = JSON.parse(JSON.stringify(this.newEvents).split(this.eventField).join('eventDate'));
        this.calendarEvents = this.newEventsInfo.map(({ Key, Summary, eventDate, Created }) =>
          ({ title: Key + ' : ' + Summary, start: eventDate, id: Key, tooltip: Summary }));

        this.eventsData = this.calendarEvents.map(function (o) {

          o.start = moment.utc(o.start).format('YYYY-MM-DD');
          return o;

        });

         this.events = this.eventsData;


      });
    }

  }

  handleDayClick(e) {

    let dayJql;
    let dateStart = moment.utc(e.date._d).local().format('YYYY-MM-DD');
    var dateClicked = moment(dateStart).add(1, 'days').format('YYYY-MM-DD');
    var nextDay = moment(dateClicked).add(1, 'days').format('YYYY-MM-DD');
    dayJql = this.calendarTitleJql + ' AND created >=' + dateClicked + ' AND created<= ' + nextDay;
    this.userService.search(dayJql); 

  }

}