如何在角度模板中包含外部 javascript？

Question

我有一个名为 index.html 的页面，其表单依赖于外部 javascript：

<script src="https://js.braintreegateway.com/v2/braintree.js"></script>
<script>
var clientToken = removed
braintree.setup(
          // Replace this with a client token from your server
          clientToken,
          "dropin", {
            container: "payment-form",
            form: "checkout",
          });
</script>

在将此页面与 angular 集成之前，我进行了测试以查看它是否有效，但现在我已将此页面集成为 angular 状态：$stateProvider

 .state('billing', {
        url: '/billing',
        views: {
            'main': {
                controller: 'BillingController as billingCtrl',
                templateUrl: '/billing/index.html'
            }
        }
    });

路由到上述页面时，我收到这些错误：

我想避免依赖像 Braintree-angular 这样的 3rd 方库。 在我看来，angular 模板无法识别标签，因为它们用于将控制器绑定到 html。

Answer 1

包含 js 文件的最佳方法是将其路径添加到 Angular.js 中的脚本键（字符串数组）：

1. 在资产文件夹中创建一个名为脚本的文件夹（以获得更好的结构）
2. 将您的脚本文件添加到此文件夹中
3. 打开存在于 angular 项目根目录中的 angular.json 文件
4. 将文件路径添加到脚本键

 { "projects": { "you-will-find-your-project-name-here": { "architect": "scripts": ["src/assets/scripts/myScriptsFile.js,] }, .... }

Answer 2

在构建过程中生成了一个 index.html，其中包括所有资产，包括 js/controller 文件。 包含外部 js 文件的答案只是将我的脚本标记插入包含所有依赖项的 index.html 文件。