Fullcalendar:如何在eventclick上更改事件标题

时间:2017-08-09 14:03:23

标签: angular typescript fullcalendar

我正在使用Fullcalender angular 2

export class Calender {

        public value: any = 2;
        public modalData: any[];
        calendarOptions: any;
        @ViewChild(CalendarComponent) myCalendar: CalendarComponent;

        changeCalendarView(view) {
            this.myCalendar.fullCalendar('changeView', view);
        }


        form: FormGroup;

        constructor(private route: Router, private calenderservice: CalenderService, private appstate: AppState) {

        }

        ngOnInit() {

            this.calendarOptions = {
                height: '1000',
                fixedWeekCount: false,
                header:
                {
                        left: 'prev,next,today',
                        center: 'title',
                        right: 'month,listYear',
                        },
                defaultDate: '2017-01-01',
                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);
                        });
                },

                eventClick: function (event, jsEvent, view) {   
                    alert('Your seat has been reserved on this date and time:' + event.start.format());
                    console.log(event); 
               event.title = "clicked on"; 
                this.myCalendar.fullCalendar('updateEvents', event)
                    localStorage.setItem('Events', JSON.stringify(event));          
                },

               dayClick: function(date, jsEvent, view) {
                    alert('Clicked on: ' + date.format());
                }

            };
        }

在eventclick中,我在事件显示调试器中的新更改后,更改要点击的event.title,但日历没有刷新或使用新的更改事件进行更新。

请帮助我,我对角度2更新。

提前致谢

1 个答案:

答案 0 :(得分:0)

您必须使用箭头功能表示法() => {},不要使用function关键字,或者您的this上下文已更改为该功能:

eventClick: (event, jsEvent, view) => {   
     event.title = "clicked on"; 
     this.myCalendar.fullCalendar('updateEvents', event)
     localStorage.setItem('Events', JSON.stringify(event));          
}