在Angular 4中導入外部js文件並訪問函數和變量

Question

也許我的標題有點不清楚，所以我會嘗試用一個簡單的任務來解釋我的問題。

可以說我有一個下面的JavaScript文件 「file.js」：

var number = 4; 

function encode(){ 
    console.log("encode in "file.js" has been called..."); 
} 

我把這個腳本在我angular4項目 「的src /資產/ JS/file.js」。

在「.angular-cli.json」我添加腳本的路徑

"scripts": [ 
    "../node_modules/jquery/dist/jquery.min.js", 
    "./assets/js/modernizr.js", 
    "./assets/js/webflow.js", 
    "./assets/js/file.js" 

現在我的問題是如何可以導入或使用我app.module.ts這個腳本文件或任何其他組件，不增加它的index.html

我試了幾種方法：

import * as test from 'assets/js/file.js'; 
import {test} from 'assets/js/file.js'; 
declare var file: any; 

不幸的是，沒有工作......

我真的很感激它，如果你們能幫助我。

Answer 1

您可以使用system.js在運行時導入文件，如下所示，您必須在node_modules中添加systemjs。

System.import("src/assets/js/file.js").then(fileInstance => { 
     console.log(fileInstance); 
}); 

Answer 2

在component.ts中，您應該聲明要使用的函數的名稱。

declare let encode:any 

ngOnInit(){ 
    encode() 
}