Angular 2;如何隐藏/禁用fullcalendar

Question

往事，我使用full calendar

this.calendarOptions = { 
      height: '1000', 
      fixedWeekCount: false, 
      header: 
      { 
       left: 'prev,next,today', 
       center: 'title', 
       right: 'month,listYear', 
      }, 
      defaultDate: new Date(), 
      editable: true, 
      timeFormat: 'hh:mm A', 
      eventLimit: true, 


      events: (start, end, title, callback) => { 
       this.calenderservice.getExamCandidateById(this.value) 
        .subscribe(response => { 
         callback(response), 
          this.modalData = response.Items 
         this.myCalendar.fullCalendar('renderEvents', this.modalData) 
         console.log(this.modalData); 
         console.log(response); 
        }); 
      }, 

响应

Items:{ 
    ExamName:null 
    ExamSiteId:334 
    Id:85 
    LastUpdateDateTime:"0001-01-01T00:00:00" 
    PostalCode:"33172" 
    PptSeats:null 
    SeatCount:0 
    SiteName:"UF" 
    State:"FL" 
    end:"2017-09-27T10:30:00" 
    isCbt:"1" 
    isPpt:null 
    start:"2017-09-27T10:30:00" 
    title:"7 available" 
} 

从上面的代码我得到的所有启动和响应结束日期，并显示在事件日历

我想隐藏过去的事件，我如何隐藏包含当前日期在fullcalendar中的过去开始和结束日期的事件。

请帮帮我。

Answer 1

您应该在将值传递到完整日历之前应用过滤器。像这样：

events: (start, end, title, callback) => { 
      this.calenderservice.getExamCandidateById(this.value) 
       .subscribe(response => { 
        callback(response), 
        var date = new Date(); //Today's date 
        this.modalData = response.Items.filter(item => item.StartDate > date || item.EndDate > date ); //only select items whose start or end date are after today's date. 
        this.myCalendar.fullCalendar('renderEvents', this.modalData) 
        console.log(this.modalData); 
        console.log(response); 
       });