Javascript 在angular 6组件中使用外部js文件

我试图在angular 6应用程序中使用js文件。我遵循的步骤如下：

1。已创建

testfile.js

文件：

import { Component, OnInit } from '@angular/core';
import "../../../assets/js/counter";

2。在

angular.cli.json

中。出于测试目的，tesfile.js与

angular.cli.json位于同一位置。

is:

3。在typings.d.ts文件中，声明它：

import { Component, OnInit } from '@angular/core';
import "../../../assets/js/counter";

声明var testmodule:any

4。在ts文件中，尝试将其用作：

import { Component, OnInit } from '@angular/core';
import "../../../assets/js/counter";

但当使用角度组件时，控制台中的警告是：

Uncaught ReferenceError: testmodule is not defined

我尝试了另一种选择，比如将js文件导入.ts文件中，如下所示：

import*作为mymodule'../../testfile.js'
“allowJs”：true
但这也不是识别testmodule或testfile
我怎么会在这里
 我做了一个演示：，就像这样：

testfile.js

函数testa（）{}
testa.prototype.testMethod=函数testMethod（）{
console.log（“你好”）；
};
var testmodule=newtesta（）；
导出{testmodule}；

在
main.ts中

从“@angular/core”导入{enableProdMode}”；
从“@angular/platformBrowserDynamic”导入{platformBrowserDynamic}”；
从“/app/app.module”导入{AppModule}；
从“/environments/environment”导入{environment}；
从“/testfile”导入{testmodule}；
testmodule.testMethod（）；
if（环境、生产）{
enableProdMode（）；
}
platformBrowserDynamic（）
.bootstrapModule（AppModule）
.catch（err=>console.log（err））；

您可以在控制台选项卡上看到“hello”文本

注意，我在
testfile.js
中做了一些更改，以引用angular-cli.json文件中的脚本

"scripts": [
    "../path_of_script" 
 ];

然后加上typings.d.ts

declare var testModule : any;

将其导入到要使用的位置

import * as myModule from 'testModule';

您可以在angular.json中导入外部JS

如果您想为特定的html组件导入JS文件，那么您可以在yourComponent.ts中导入您的JS文件

就像：

import { Component, OnInit } from '@angular/core';
import "../../../assets/js/counter";

你可以在这里看到我在特定的HTML页面中导入了counter.js

在这一行“。/../assets/js/counter”counter是一个js文件名。您无需在文件名后添加.js

请确保仔细设置路径。。/../../

您可以将所有外部js文件存储在资产/js文件夹中。然后可以在specific component.ts中导入特定的js文件

这在angular 6中非常适合我。
是的，是打字错误。我尝试了导出默认值和导出{}，但问题相同。@sdeep我做了一个演示，不知道这是否是您需要的伟大！！成功了。但是我不明白为什么将函数设置为原型会起作用。@s好了，我按照下面的说明进行操作
import { Component, OnInit } from '@angular/core';
import "../../../assets/js/counter";