在angular 4应用程序中使用外部的javaScript库

我有一个角度为4的应用程序，我有一个javascript组件，我在javascript文件中创建：timeline.js。 javascript组件效果很好，但我想用角度为4.所以，我把我的js文件放在文件夹assets/js/timeline.js。在angular 4应用程序中使用外部的javaScript库

在文件index.html，我打电话给我的js文件与<script src="assets/js/timeline.js"></script>和app.component.ts，我有：

var timeline = new Timeline("timelineVisualization")

所以，通常情况下，时间线中有id="timelineVisualization"在div创建的。

但它不起作用，我在new Timeline错误：无法找到名称时间轴。

那么，你知道我怎样才能从timeline.js调用时间轴构造函数吗？

来源

2017-07-06 Adrien

你只需做

import * as Timeline from '../assets/js/timeline.js';

你也可以做（在你的文件的顶部）：

declare var Timeline: any;

检查也below良好做法。

来源

2017-07-06 10:10:35

好的，谢谢，它适用于'declare var Timeline：any;' – Adrien

试试这个：

declare const Timeline;

来源

2017-07-06 10:12:00 Faly

你可以尝试从找到你的类型定义：

Definitly Typed Github Page

如果你不能找到你的图书馆，你可以自己写你的接口（和尝试把它请求到其他开发者的github页面），这个接口就像.ts文件一样。

这里是一个开始

declare global { 
    interface Window { 
     Timeline: any 
    } 
}

来源

2017-07-06 10:13:40

就延长对above答案通过@Deblaton让 - 菲利普和作为一般的好习惯，它可能会更好，包括您的JS或其他css文件的部分而不是将它们放在你的index.html中。

如果您使用CLI，请使用类似这样的东西。

"styles": [ 
    "styles.scss", 
    //Other style files 
    ], 
    "scripts": [ 
    "../node_modules/jsplugin/dist/js/plugin.js", 
    //Other script files 
    ],

来源

2017-07-06 10:16:16

在angular 4应用程序中使用外部的javaScript库

回答

相关问题