首页 > 解决方案 > Angular:如何在所有组件中跨应用程序加载外部脚本

问题描述

脚本标签:

<script src="https://www.test.com/dem0.js"></script>
<script src="https://www.test.com/dem01.js"></script>
<script src="https://www.test.com/dem02.js"></script>
<script src="https://www.test.com/dem03.js"></script>

索引.html:

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Mobile</title>
  <base href="/">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="wsstitle" content="catalog">
  <meta name="wssmlc" content="/us/en/">

  <link rel="icon" type="image/png" href="favicon.ico" sizes="32x32">
  <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i" rel="stylesheet">
</head>

<body>
  <app-root></app-root>
</body>

</html>

我的外部<script>标签很少,我想让它们在整个应用程序中可用(应该能够在浏览器中更改视图时加载它们)。如果我将它们包含在我的 index.html<head>标记中,它只会在应用程序最初加载时第一次工作,但对于我的情况,我必须在视图更改时加载它们。在标签中包含脚本<body>将是一个好习惯??

标签: angulartypescript

解决方案


在 angular-cli.json 下添加脚本引用路径

     "scripts": [
       "../src/assets/scripts/asn1.min.js"
      ],

在组件 .ts 文件中使用它

声明 var libraryName: any;


推荐阅读