我想在我的 Angular 组件中使用 <script> ，我该怎么做？（打字稿，Angular12）

【问题标题】：I would like to use a <script> in my Angular component, how do I do that ? (TypeScript, Angular12)我想在我的 Angular 组件中使用 <script> ，我该怎么做？（打字稿，Angular12）
【发布时间】：2021-09-19 17:01:45
【问题描述】：

这是我想在 Angular 组件中使用的代码：

  <form action="https://www.meu-site.com/processar-pagamento" method="POST"> <script
src="https://www.mercadopago.com.br/integrations/v1/web-tokenize-checkout.js"
data-public-key="ENV_PUBLIC_KEY"
data-transaction-amount="100.00"></script></form>

【问题讨论】：

您可以在 index.html 文件中添加角度
嗨不行：（

标签： javascript angular typescript

【解决方案1】：

如果您必须从远程站点加载脚本，您可以将其添加到 index.html 文件中，就像在常规 html 站点中所做的那样。

index.html

<!-- get script from 3rd party site -->


<script
     src="https://www.mercadopago.com.br/integrations/v1/web-tokenize-checkout.js"
     data-public-key="ENV_PUBLIC_KEY"
     data-transaction-amount="100.00">
</script>

然后，要在你的组件中使用脚本，你需要手动声明导出的变量/函数以避免TS编译错误

** formComponent.ts**

declare let web-tokenize-checkout: any; //declare the name of the global object you got from the script you added

//use your script functionality, That part is really depends on how the script you imported works
web-tokenize-checkout.doWhatEverYouNeed(....);

【讨论】：