<script> 不适用于 angular 5 个组件（格子 Link 和 Angular 2+）

Question

我正在尝试在 Angular 网络应用程序中使用 Plaid Link。 plaid 提供的脚本似乎只能在 index.html 文件的 <body> 内部起作用。当我尝试在组件中使用它时，脚本根本不会运行。

我正在关注 https://plaid.com/docs/quickstart/#step-2-simple-integration

中的文档

他们有一些 jquery 代码可以正常工作，如果我只制作一个基本的 html 文件，但在 angular 组件/[=17 中不起作用=]

这是在 angular 中不起作用的代码示例？

`<form id='plaid-link-form'></form>
<script
src="https://cdn.plaid.com/link/v2/stable/link-initialize.js"
data-client-name="My App"
data-form-id="plaid-link-form"
data-key="[PUBLIC KEY]"
data-product="auth"
data-env="sandbox">
</script>`

编辑：我犯了一个错误。我使用 Angular 5，而不是 2。

Answer 1

如果您正在使用 system.js，请尝试使用 system.js 的 import 函数导入脚本，如下所示：-

export class YourComponent {
  constructor(){
    System.import('https://cdn.plaid.com/link/v2/stable/link-initialize.js').then(Plaid => {
      var handler = Plaid.create({
        clientName: 'My App',
        env: 'sandbox',
        key: '[PUBLIC_KEY]', // Replace with your public_key to test with live credentials
        product: ['auth'],
      });
    });
  }
}

如果您使用的是webpack，那么您可以调用require.ensure函数来加载所需的文件。

export class YourComponent {
  constructor(){        
   require.ensure(['https://cdn.plaid.com/link/v2/stable/link-initialize.js'], require => {
     let Plaid = require('<module_path>');
     Plaid.create({
       // config object
     })
   }); 
  }
}

Answer 2

我在此存储库中找到了格子 link 的 Ionic 2 (Angular2+) 使用。 https://github.com/pbernasconi/plaid-link-ionic-2-example/tree/master/src 我将脚本添加到索引，然后运行它在控制器中。我不完全明白 declarations.d.ts 文件是如何发挥作用的，但我现在有一个包含相同代码的文件。

<script> 不适用于 angular 5 个组件（格子 Link 和 Angular 2+）

<script> not working in angular 5 components (Plaid Link with Angular 2+)

jquery

angular

plaid