在angular应用程序中使用外部javaScript库 [英] Use external javaScript library in angular application

问题描述

我有一个angular 4应用程序，我有一个在javascript文件timeline.js中创建的javascript组件. javascript组件运行良好，但我想将其与angular 4一起使用.因此，我将js文件放在文件夹assets/js/timeline.js中.

I have an angular 4 application and I have a javascript component that I created in a javascript file : timeline.js. The javascript component works well but I want to use it with angular 4. So, I put my js file in the folder assets/js/timeline.js.

在文件index.html中，我用<script src="assets/js/timeline.js"></script>调用我的js文件，在app.component.ts中，我有:

In the file index.html, I call my js file with <script src="assets/js/timeline.js"></script> and in app.component.ts, I have :

var timeline = new Timeline("timelineVisualization")

因此，通常，时间轴是在具有id="timelineVisualization"的div中创建的.

So, normally, the timeline is created in the div which has id="timelineVisualization".

但是它不起作用，并且在new Timeline上出现错误:找不到名称时间轴.

But it doesn't work and I have an error on the new Timeline : Cannot find name Timeline.

那么，您知道如何从timeline.js调用时间轴构造函数吗?

So, do you know how I can do to call the Timeline constructor from timeline.js ?

推荐答案

您只需要做

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

您也可以(在文件顶部)进行操作:

You can also do (at the top of your file) :

declare var Timeline: any;

还要在下面进行检查，以了解良好做法.

Check also below for good practices.

这篇关于在angular应用程序中使用外部javaScript库的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！