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);
                });

角2;如何在fullcalendar中隐藏/禁用过去的事件

1 个答案: