dhtmlx在angular2組件內

Question

我想在我的Angular2組件中使用dhtmlx onEmptyClick事件，我想在其中調用我的組件的名為changewall()的函數，但是收到錯誤：

this.changeWall不是一個函數

如果我在scheduler.attachEvent外部放置changewall()則正常工作。 為什么會這樣？

不工作：

 scheduler.attachEvent("onEmptyClick", function (date, e ){
                        console.log('clickBefore');
                        this.changeWall(1511305200000);
                        console.log('clickAfter');
                    });

這個工作：

 this.changeWall(1511305200000);
     scheduler.attachEvent("onEmptyClick", function (date, e ){
                                console.log('clickBefore');
                                console.log('clickAfter');
                            });

整碼：

import {Component, OnInit, AfterViewInit, HostListener} from '@angular/core';
import {WallService} from "../../services/wall.service";
declare var scheduler:any; //hide errors
@Component({
    moduleId: module.id,
    selector: 'big-calendar',
    templateUrl: 'calendar2.component.html',
    styleUrls: ['calendar2.component.scss']
})
export class Calendar2Component implements AfterViewInit {
    private wallInstance: any;
    events: any;
    constructor(private _wall: WallService) {

    }

    @HostListener('click', ['$event'])
    onClick(e) {
    // this.refreshCalendar();
    }

    refreshCalendar(){
        let date = new Date(scheduler.getState().date);
        let month = date.getMonth() + 1;
        let year = date.getFullYear();
        // scheduler.clearAll();

        scheduler.attachEvent("onEmptyClick", function (date, e ){
            console.log('clickBefore');
            this.changeWall(1511305200000);
            console.log('clickAfter');
        });

        this._wall.getCalendarEvents(month, year).subscribe((data: any)=>{
            console.log(data);
            let i = 0, events = [];

            while(i < data.events.length){
                events.push({
                    holder: "t", //userdata
                    room:   "1" ,
                    text: data.events[i].name,
                    start_date: data.events[i].start,
                    end_date: data.events[i].end +1
                });

                i++;
            }
            console.log(events);
            scheduler.init('scheduler_here',new Date(),"month");

            scheduler.parse(events,"json");
        });
    }


    ngAfterViewInit(): void {
        scheduler.config.touch = "force";
         this.refreshCalendar();
        // scheduler.parse([
        //     {id:1, text:"Meeting",   start_date:"04/11/2016 14:00",end_date:"14/12/2016 17:00"}
        // ],"json");
    }

        changeWall(timestamp){
        // let timestamp = new Date(date).getTime();
        // console.log(timestamp);
        this.wallInstance = this._wall.getInstance();
        this.wallInstance.timeChanger(timestamp);
    }
}

Answer 1

scheduler.attachEvent("onEmptyClick", function (date, e ){

應該

scheduler.attachEvent("onEmptyClick", (date, e ) => {

並且還會更改您使用function的其他位置

請參閱https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions