在 Angular 的组件中插入 JavaScript

Posted

技术标签:

【中文标题】在 Angular 的组件中插入 JavaScript【英文标题】:Inserting JavaScript inside components in Angular 【发布时间】:2019-10-13 01:03:45 【问题描述】:

我想在 Angular 项目中的 .html 组件中插入一个 <script>...</script>,我想知道如何做到这一点。

似乎我插入到这个组件中的任何 javascript 都被忽略了。

【问题讨论】:

您可以检查这些答案以在 Angular 中包含 javascript。***.com/questions/37081943/… 【参考方案1】:

是的,您可以在 Angular 中添加 javascript。您可以制作一个外部 Javascript 文件并将所有代码放入该文件中。例如,您的文件是 /app 文件夹中的 external.js。现在您可以在Angular 组件。这是我找到的最简单的方法。您可以使用导入来包含您的外部文件。代码如下。

import './external.js';
declare var myExtObject: any;

现在在这里使用一个变量,我命名为 myExtObject 来调用 External.js 文件函数,就像在你想要的任何地方一样:

myExtObject.func1();

【讨论】:

嗨,Ishan,感谢您的回复,我对我的问题表示歉意,因为我对 Angular 不是很熟悉。我需要输入: import './external.js';声明 var myExtObject: any;在 .html 文件中。然后在 .external.js 文件中我输入: myExtObject.func1( My Javascript Code ); ? @Mor 您不需要将 external.js 文件包含到您的 html 文件中。您需要在 Angular 组件和 angular.json 中导入 external.js 文件以及应用程序中的路径.只要按照上面说的导入就可以使用了。 但是我想只在这个特定页面上使用这个 Javascript 代码,它应该在页面的正文上运行。如何做呢?我不认为我清楚地了解每个代码应该放在哪里。 @Mor 您还可以将此 external.js 文件包含在 index.html 文件的头中,该文件位于 Angular 项目中您的应用程序文件夹之外。然后您可以像我上面提到的那样声明变量并可以使用它在角度组件中。您可以参考此链接。 link

以上是关于在 Angular 的组件中插入 JavaScript的主要内容,如果未能解决你的问题,请参考以下文章

如何将日历组件插入 Angular 2 应用程序?

Angular 2 - 使用 ComponentResolver 加载在运行时下载的组件

如何使用 ng-bind-html 插入 Angular 1.5 组件

以编程方式插入不同的 Angular2 组件

Angular2 DynamicContentLoader 将元素插入到目标容器的顶部

Angular2:使用DynamicComponentLoader动态插入的组件上的双向数据绑定