Question

我在angular2中使用fullcalendar，在插槽的Onclick上，调用将转到CalendarOptions中的回调函数。 select：回调函数正在调用但是当我尝试从内部调用angular2函数时选择：那里使服务（ this.calenserService.save（））调用它抛出错误： 不能保存未定义的属性“保存” 基本上我不能在回调函数中使用angular2组件对象/方法，如选择：＆amp;的 eventClick：

calender.html

<angular2-fullcalendar [options]="calendarOptions"></angular2-fullcalendar>

calender.component.ts

calendarOptions = {   
    header:
    {
        left: '',
        center: 'title',
        right: 'month,agendaWeek,agendaDay,today, prev,next '
    }, 

    slotDuration:'00:20:00',     
    defaultDate: new Date(),
    editable: true,
    eventLimit: true, 
    selectable: true,
    selectHelper: true,
    select: function(start, end, allDay)
    {
        let event:Event=new Event();
        event.id='785';
        event.selectable=true;
        event.start=start;
        event.title="Test";
        event.end=end;
        **this.calenderService.save(event) // This is Angular2 component object not able to access from here**        
    },    
    eventClick: function(calEvent, jsEvent, view) {
        alert('Event: ' + calEvent.title);
        this.callFun() //**This is Angular 2 component function Not able to access**
    },        
    events:this.events //this.events is Angular2 class object
};

Answer 1

使用箭头功能保留this

eventClick: (calEvent, jsEvent, view) => {
    alert('Event: ' + calEvent.title);
    this.callFun();
},

...
select: (start, end, allDay) => {
...

箭头函数捕获创建函数的this，而不是它被调用的位置。

另见

https://github.com/Microsoft/TypeScript/wiki/%27this%27-in-TypeScript

angular 2如何使用fullcalendar

1 个答案: