javascript - 将脚本 JS 添加到我的 angular7 项目中

Question

对于我的项目，我需要将“Loadingbar.js”库安装到我的页面之一(您可以在此处找到: https://loading.io/progress/ )。我确实将 CSS 粘贴到了我的全局“style.css”文件中。

所以，首先，我只是尝试输入 <script></script>在我的索引中:

<script type="text/javascript" src="assets/js/loading-bar.js"></script>

它工作了几个小时，现在不再工作了。所以我尝试了一切:我尝试将 <script>在我的index.html的每一行中，甚至在我的页面的html中，在正文中，在正文下，在 <app-root></app-root> 下，到处都是...没有任何效果。

此外，Angular 项目有时会困扰我:js 很少加载一次。如果我刷新页面而不更改任何内容 - 它就不再工作了。

我尝试将“defer”添加到 <script></script> .

我尝试等待文档准备好，我尝试了 setTimeout，但它从未起作用。

我尝试在“angular.json”中添加脚本的路径，但没有成功。

我该怎么做才能让这项工作成功？如何将 JS 库添加到 Angular 项目中？

谢谢。

Answer 1

您应该知道的第一件事是，在 Angular 应用程序中最好使用 npm如果可能的话，任何库的依赖项。如果这是不可能的并且您需要使用外部js文件，您可以按照以下步骤操作:

1. 首先，将你的js放入node_modules中文件夹。例如:node_modules/test-lib/loading-bar.js

2. 在您的 app.module.ts 内，您可以将此行放在文件顶部:

   import test-lib/loading-bar.js (没有 node_modules )