在我的 angular 2 項目中使用外部 JS 庫

Question

我需要在我的 angular 2 項目中使用這個 JS 庫

這個問題可能對我來說是重復的，但沒有答案對我有用

我試圖將庫作為腳本標記包含在我的 index.html 頁面中

它總是看不到它http://localhost:8100/PrayTimes.js文件不存在

我也在上面寫了這段代碼

declare var PrayTimes:any;

我試圖在我的構造函數中使用它，但出現此錯誤

PrayTimes 未定義

Answer 1

如果使用angular-cli，則可以在assets文件夾中添加所有外部JS文件。 然后在angular-cli.json添加它們：

"scripts": [
        "../node_modules/jquery/dist/jquery.min.js",
        "../node_modules/bootstrap/dist/js/bootstrap.min.js",
        "../node_modules/moment/moment.js",
        "../node_modules/chart.js/dist/Chart.bundle.min.js",
        "../node_modules/chart.js/dist/Chart.min.js",
        "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker.min.js",
        "./assets/js/slimscroll.min.js",
        "./assets/js/inspinia.js",
        "./assets/js/metisMenu.js",
        "./assets/js/footable.all.min.js"
      ]

您也可以使用外部樣式執行此操作：

"styles": [
        "../node_modules/ng2-toastr/bundles/ng2-toastr.min.css",
        "../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss",
        "../node_modules/font-awesome/scss/font-awesome.scss",
        "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker3.min.css",
        "./assets/scss/plugins/footable/footable.core.css",
        "./assets/scss/style.scss"
      ]

當然你是對的，然后你需要添加typings.d.ts ：

declare var PrayTimes:any;
declare var System: any;
declare var $: any;
declare var moment: any;
declare var Chart: any;

Answer 2

將所有javascript，外部CSS，圖像等放在src/assets

（將編譯為build/assets ）

在index.html ： <script src="assets/yourJavascript.js"></script>

然后你可以像你描述的那樣使用它。 （ declare var PrayTimes: any; ）

Answer 3

我需要在外部庫中使用 function，所以我沒有聲明 JS class，而是聲明了 JS function。

declare function zoom(t: any);