从angular 2项目调用javascript文件

我在jQuery中编写了一个日历控件，我想在angular 2项目中使用它

我从这个主题的其他答案中了解到，我可以使用jQuery的getScript api调用外部javascript文件

我的calendar.component.ts如下所示：

import { Component, OnInit, AfterViewInit }     from '@angular/core';
import { Auth }                                 from '../auth.service';

declare var $:any;
declare var CustomCal:any;

@Component({
    selector:       'app-calendar',
    templateUrl:    './calendar.component.html',
    styleUrls:      ['./calendar.component.css']
})
export class CalendarComponent implements OnInit {

    private year : number;
    myCal : any;

    constructor(private auth : Auth) {
    }

    ngOnInit() {
    }

    ngAfterViewInit() {
        this.year   = 2017;

        $.getScript('./app/calendar/zapCalendar.js', function(){
            console.log("got call'd back");
            this.myCal = new CustomCal(2017);
        });
    }
}

我收到控制台消息got call'd，然后收到一条错误消息，指出CustomCal未定义

我的自定义类在zapCalendar.js中定义如下：

class CustomCal
{
    constructor(nYear) {

        this._mouseDown     = false;
        this._mouseDrag     = false;

        this._lastItem      = 0;
        this._nYear         = nYear;

        this.CreateCalendarFrame();
        this.AddEventHandlers(this);
    }

    ...
}

我已尝试在zapCalendar.js文件中导出该类，并尝试将以下内容添加到zapCalendar.js文件中：

$( function() {
    var myCal = new CustomCal(2017);
});

我错过了什么？ 谢谢

更新： 我刚刚在zapCalendar.js中替换了这个

$( function() {
    var myCal = new CustomCal(2017);
});

为此：

var x = new CustomCal(2017);

现在日历已正确呈现。但是如果可能的话，我想在我的打字稿中找到日历的参考。这可能吗

    $.getScript('./app/calendar/zapCalendar.js', function(){
        console.log("got call'd back");
        this.myCal = new CustomCal(2017);
    });

这里的内部函数将不具有相同的this引用，因为它不会被绑定到对象调用。因为您使用的是TypeScript，所以可以使用箭头函数来更改此行为

    $.getScript('./app/calendar/zapCalendar.js', () => {
        console.log("got call'd back");
        this.myCal = new CustomCal(2017);
    });

---

您需要导出类，然后将其导入到组件中

import {CustomCal} from "./app/calendar/zapCalendar";

---

谢谢你，我还没有意识到这是一个新的角度。但是，尽管我的这个引用现在可能是正确的，但我仍然得到一个错误，即控制台中没有定义CustomCal。我不熟悉编写模块。当我在CustomCal类前面加上export关键字并尝试导入时，收到消息“找不到模块”。/zapCalendar。应该有文件。/app/calendar/zapCalendar.ts.ts吗？但是我的zapCalendar是一个javascript文件，我觉得我需要用typescript/angular2重写我的日历ctrl。不赞成使用jquery吗？请注意，Typescript是它自己的东西。您可以编写一个Typescript文件，它与Angular无关。因为您的代码只是一个类，所以不应该花费大量的移植工作来解析为Typescript。