尝试将 Braintree-Web 集成到 Angular2 中

我正在尝试在我的 Angular2 应用程序中使用 Braintree SDK (braintree-web)。我真的很感激任何有关如何使其发挥作用的指示。我认为这是因为我没有导入 Braintree-web 模块，但我也不知道如何导入。我可以在整个模块中找到任何导出。

这是我所在的地方：

我已经导入了 Braintree-web 库和我找到的打字文件。

ng install --save braintree-web
npm install @types/[email protected] /cdn-cgi/l/email-protection

我尝试将 Braintree 提供的 JS 示例破解为 Angular2 TS 组件，但我不断收到错误：

异常：错误：未捕获（承诺）：异常：错误 ./UpaccountComponent 类 UpaccountComponent - 内联模板：5:7 原始异常：类型错误：this.braintree.setup 不是函数

这是 .ts 文件。

import { Component, OnInit } from '@angular/core';


declare var braintree:any;

@Component({
  selector: 'up-btcheckoutform',
  templateUrl: './btcheckoutform.component.html',
  styleUrls: ['./btcheckoutform.component.css']
})
export class BtCheckoutFormComponent implements OnInit {
  braintree = require('BrainTreeWeb');
  // braintree = require('braintree-web');
  integration: any

  constructor() {   }

  ngOnInit() {
    var c = this;
    var clientToken = "CLIENT_TOKEN_GOES_HERE";
    braintree.setup(clientToken, "dropin", {
      container: "payment-form",
      onReady: function(int) {
        c.integration = int
        }
      });
  }

  ngOnDestroy() {
    this.integration.teardown();
  }


}

我不确定 Braintree-web 具体的用法，但如果您使用的是 webpack，请删除这些行declare var braintree:any; and braintree = require('BrainTreeWeb');

您还需要将 Braintree-web/index.js 文件添加到捆绑包中，除非它们有 UMD 模块。

快速浏览一下 Braintree-web，它看起来像braintree.setup(..)不是一个函数。像这样的东西可能是等效的：

braintree.client.create({ 
      authorization: "long-token-string"},
      (err, client) => {
            // Do stuff here
            client.request({..});
      });

安装软件包后，您需要添加--save-dev到安装类型。