如何在 Angular 中包含外部 javascript 文件？

Question

我一直在使用 Angular，我试图包含一个外部 .js 文件，但 Angular 一直忽略它。 我尝试将文件包含在<header> 。

我尝试通过在组件内使用 styleUrl 来包含它

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  stylesUrl: ['/js/bootstrap.min.js']
})

但似乎没有任何效果。

我应该怎么做？

Answer 1

将script标记添加到您的index.html文件（或等效文件）并将 src 设置为 JavaScript 文件。 然后当页面被请求时，它将包含文件。 如果您需要调用特定的引导程序方法，您将需要使用模块导入在您的组件中导入库以在您的 TypeScript 代码中引用它。

Answer 2

您的问题是针对 Angular 2 的，stylesUrl 是针对 css 而不是 js。

在 Angular 2 中连接依赖项以不同的方式完成，具体取决于依赖项是什么。 可以通过扩展类、注入依赖项或在合适的情况下添加注释来连接依赖项。 在不太好的情况下，可能需要进行黑客攻击。 这是关于依赖注入的官方文档。

看起来您特别关心 Bootstrap。 以下是将 Bootstrap 注入 ng2 组件的方法。

Answer 3

在 styleUrl 上，您应该包含样式文件。 您可以在 angular.json（来自 Angular 6+）或 angular-cli.json（Angular 6 之前）上包含外部 javascript 或 css 文件。

或者简单地说，您可以将那些包含在 index.html 中。