当前位置: 首页 > 面试题库 >

Angular 2:将外部js文件导入组件

鲁建茗
2023-03-14
问题内容

我将将此d3gauge.js文件导入我的angular2组件memmon.component.ts文件之一。

import '../../../../js/d3gauge.js';
export class MemMonComponent {
    createMemGauge() {
        new drawGauge(this.opt);  //drawGauge() is a function inside d3gauge.js
    }
}

然后在相应的模板文件中添加

<script src="../../../../js/d3gauge.js"></script>

但这是行不通的,drawGauge无法找到。

所以,

  1. 将外部js文件导入angular2的正确步骤是什么?
  2. 由于我使用的是webpack,是否可以在webpack中进行?我指的是这个问题,由于无法解决,因此webpack解决方案对我不起作用.ensure

问题答案:

理想情况下,您需要具有.d.ts用于键入的文件才能Linting正常工作。

但是似乎d3gauge没有,您可以要求开发人员提供并希望他们会听。

或者,您可以通过执行以下操作解决此特定问题

declare var drawGauge: any;

import '../../../../js/d3gauge.js';
export class MemMonComponent {
    createMemGauge() {
        new drawGauge(this.opt);  //drawGauge() is a function inside d3gauge.js
    }
}

如果您在多个文件中使用它,则可以d3gauage.d.ts使用以下内容创建文件

declare var drawGauge: any;

boot.ts在顶部的(bootstrap)文件中引用它,就像这样

///<reference path="../path/to/d3gauage.d.ts"/>


 类似资料:
  • 问题内容: 我编写了一个Java代码,该文件导入了一个外部jar文件。如何在命令行上编译和运行它? 提前致谢! 问题答案: 从命令行编译: 运行: 对于Windows,请用作路径分隔符(而不是)。

  • 本文向大家介绍Vue如何基于es6导入外部js文件,包括了Vue如何基于es6导入外部js文件的使用技巧和注意事项,需要的朋友参考一下 也许大家都是使用习惯了es5的写法喜欢直接用《Script》标签倒入js文件,但是很是可惜,这写法。在es6,或则说vue环境下不支持 真的写法是怎样? 首先。我们要改造我们要映入的外部js文件,改成下面这个格式。主要是红色方块内部代码,我们需要将我们的模块“抛出

  • 说我已经试过了。java在~/jar中/ 然后我输入: 我想将这个类导入到~/src/中的另一个源文件中: 我尝试了两种方法: 1. 编译期间可以,但当我尝试运行它时,会出现错误: 2. 我尝试在我的. bashrc和. profile中包含以下命令(我没有.bash_profile或.bash_login): 和: 但这一次,它仍然是错误的: 我应该如何包含外部 jar 文件? 编辑:整个项目只

  • 问题内容: 我已升级到angular2 RC6,并希望在引导AppModule之前加载外部JSON配置文件。在RC5之前,我已经进行了这项工作,但是现在很难找到一种等效的方式来注入此数据。 这样做虽然很好,但是很难更改为与RC6一起使用。 我正在尝试以下方法,但是努力用加载的数据修改我的预定义AppModule: 问题答案: 我有同样的问题。好像您遇到了我的要点 :-) 至于RC6更新,您应该签出

  • 我以我对React JS的了解为基础,希望导入/包含一些只包含对象/对象数组的外部JS文件。我在jQuery、Vanilla JS甚至Angular JS中都做过。含糖的 我如何在React JS中实现同样的事情。 我有以下index.html: 还有我的主菜。js(条目文件)如下所示: 在这里,我有工作。js as: 为了更好地衡量,我的webpack.config.js看起来像这样: 感谢您的

  • 警告 该语法不属于 rst ,属于 Sphinx 的配置。 由于某些需要,需要引入外部JS、样式。 此时,你需要在 conf.py 文件中, 增加 html_js_files = ['script.js', 'https://example.com/scripts/custom.js', ('custom.js', {'async