javascript - 如何在 Angular typescript 中使用 Timetable.js？

Question

我正在尝试将这个不错的 javascript 插件实现到 Angular6 项目中: Timetable.js/on Github

寻找一种方法来做到这一点，我遇到了这个: How to use Timetable.js in ionic2 typescript .这个帖子已经两年了，看来问题还没有解决。基于代码 tmnrkb发布在 angular.json 文件中声明 js 脚本文件后，我已经在我的 app.component 中编写了该代码:

import { Component } from '@angular/core';

declare class Timetable {
  constructor();
  scope: string;
  locations: Array<string>;
  events: Array<any>;
  Renderer(tt: any): any;
  setScope(start: number, end: number);
  addLocations(locations: Array<string>);
  addEvent(artistCode: string, stageCode: string, startDate: Date, endDate: Date);
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  timetable = new Timetable();

  constructor() {
    this.addTimeTable();
  }

  addTimeTable() {
    this.timetable.setScope(9, 3);

    this.timetable.addLocations(['London', 'Paris', 'Los Angeles']);

    this.timetable.addEvent('Sightseeing', 'London', new Date(2018, 8, 25, 9), new Date(2018, 8, 26, 12));

    this.timetable.addEvent('Zumba', 'Paris', new Date(2018, 8, 27, 9), new Date(2018, 8, 29, 12));

    this.timetable.addEvent('Cocktails', 'Los Angeles', new Date(2018, 8, 22, 9), new Date(2018, 8, 23, 12));

    const renderer = this.timetable.Renderer(this.timetable);
    // const renderer = new Timetable.Renderer(this.timetable);
    renderer.draw('.timetable');
  }



}

当我运行 ng serve 时，它​​会编译代码，但在控制台中出现此错误:

AppComponent_Host.ngfactory.js? [sm]:1 ERROR TypeError: this.timetable.Renderer is not a function
    at AppComponent.push../src/app/app.component.ts.AppComponent.addTimeTable (app.component.ts:39)
    at new AppComponent (app.component.ts:25)

所以我想知道为什么它说 Renderer 不是一个函数。

Answer 1

所以基于Timetable.js , ( the plugin's Github ) 我设法通过将它转换为 Typescript 使其在 Angular 中工作。这是我的 Github 的结果，以防有人感兴趣。感谢stevenaanen因为他的插件正是我所需要的。