如何将JavaScript文件导入angular2

Question

我无法弄清楚如何将javascript文件导入到我的angular2项目中。这是一个不是npm的模块的文件，我能找到的唯一指令是使用npm，这不是一个选项。

我正在使用angular cli，在我的angular-cli.json文件中，我有：

{
"apps": [
  "styles": [..],
  "scripts": ["../pathtomyjs/file.js"] 
]}

我运行了build和ng服务，当我打开我的应用程序并查看Web控制台并尝试引用我的js文件中的函数时，我能够成功完成。

我键入的控制台中的示例：

var test = MyObject; 

我得到test = {};

但是，当我尝试时

let test = MyObject;

在我的组件.ts文件中我得到：

home.component.ts (10,11): Cannot find name 'MyObject'.)

不确定如何在Angular2中执行此操作。

谢谢！

Answer 1

执行：

declare var MyObject: any;

let test = MyObject;

或者：

let test = (<any> MyObject);

对于jQuery：

declare var jQuery: any;

jQuery.ajax({ ... });

Answer 2

是第三方图书馆吗？您必须让打字稿编译器知道类型定义文件的位置。通常，它位于node_modules/@types文件夹下。例如，如果要使用jQuery，则可以通过运行：

来安装必要的类型定义文件

npm install @types/jquery

Answer 3

我将js个文件放入app/assets/scripts并将其加载到index.html <script src="assets/scripts/foobar.js"></script>。这适用于ionic2 / angular2项目。

在模块中，您必须在模块文件的全局范围内定义这样的函数

declare var myFancyFunction;

Answer 4

我对这个here进行了深入研究：

这是一个很好的问题，我很高兴你问，因为我希望我第一次遇到这个小问题的时候就有了我要写的东西。这是一个打字稿/ javascript和webpack问题，然后才会出现角度问题。我当然正计划尽快在my blog上写一篇文章。

您的情景：

你跑

npm install mathjs

1. 现在您尝试使用组件中的math.js：

2. 查找math.js dist js文件（node_modules / mathjs / dist / math.js）并像这样引用

   import {mathjs} from "../../node_modules/mathjs/dist/math";

3. 但是您收到错误消息"set --allowJS".您这样做：

   Set --allowJS in config (tsconfig.json) { "compilerOptions": { "allowJs": true, ...

4. 现在你得到：

  错误在../node_modules/mathjs/dist/math.js(12209,13）：无法访问   检测到代码。

1. 查看math.js源代码，你会看到它是一个旧的学校模块，但是没有root包装器函数（一个函数可以将它们全部带到黑暗中并绑定它们。）（稍后会详细介绍）。

解决方案：为目标库安装一个打字文件（@ types / mathjs）

read more...