braintree.dropin 的打字 angular 的 v3 打字

Typings for braintree.dropin v3 typings for angular

我正在将 Braintree Drop-in v3 集成到 angular 应用程序中 npm i -save braintree-web-drop-in.

然后我找到了包 @types/braintree-web 我正在按照提到的示例 here 但是它似乎不包含对 Drop-in 功能的支持。显然这不是正确的包。

braintree.dropin.create({
  authorization: environment.braintreeKey,
  selector: '#dropin-container'
}, function (err, dropinInstance) {
  if (err) {
    // Handle any errors that might've occurred when creating Drop-in
    console.error(err);
    return;
  }
  submitButton.addEventListener('click', function () {
    dropinInstance.requestPaymentMethod(function (err, payload) {
      if (err) {
        // Handle errors in requesting payment method
      }

      // Send payload.nonce to your server
    });
  });
});

我有进口声明 import * as braintree from "@types/braintree-web";

然后 braintree 被识别为全局命名空间,但是 braintree.dropin 仍然给我带来问题。

Typescript 编译器抱怨 dropin 对象:

Property 'dropin' does not exist on type 'typeof braintree'.

问题:

是否有一些简单的方法可以告诉打字稿一切正常并继续使用它?还是我必须自己提供打字?或者它们已经存在于某个地方?或者使用 braintree-web-package 会更好?

我使用 import * as dropin from 'braintree-web-drop-in'; 解决了它 可能是因为我在 node_modules

中安装了 braintree 模块

它显然是 Typescript 基础知识,但是我不知道的东西很无力。

由于这个问题是关于 UI 中的 braintree drop,这里是我的代码结合了 Typescript 和 angular 2. Javascript 对待 this 的方式与 Typescript 不同,所以你不应该在 Typescript 中使用 function 关键字。

  braintreeIsReady: boolean;
  dropIninstance: any;

  ngOnInit() {
    dropin.create({
      authorization: environment.braintreeKey,
      selector: '#dropin-container'
    }, (err, dropinInstance) => {
      if (err) {
        // Handle any errors that might've occurred when creating Drop-in
        console.error(err);
        return;
      }
      this.dropIninstance = dropinInstance;
      this.braintreeIsReady = true;
    });
  }

  pay() {
    this.dropIninstance.requestPaymentMethod((err, payload) => {
      if (err) {
        // deal with error
      }
      else {
        //send nonce to the server

      }
    });
  }