将Paypal Express Checkout整合到我的有角项目中

时间:2019-06-11 22:46:47

标签: angular web web-deployment paypal-sandbox

我正在尝试将PayPal Express Checkout集成到我的有角项目中,但是我遇到了一个非常奇怪的错误,这是我的PayPal集成代码。 问题是Paypal按钮没有显示在视图中,而是在chrome的“元素”标签中显示。 而且在ngAfterViewChecked的控制台日志中,我总是变得虚假。

this.paypalConfig = {
      env: 'sandbox',
      client: {
        sandbox: 'key here',
        // production: '<your-production-key here>'
      },
      commit: true
   }

private loadExternalScript(scriptUrl: string) {
    this.addScript = true;
    return new Promise((resolve, reject) => {
      const scriptElement = document.createElement('script')
      scriptElement.src = scriptUrl
      scriptElement.onload = resolve
      document.body.appendChild(scriptElement)
    })
  }
  ngAfterViewChecked(){
    const elementExists = !!document.getElementById('paypal-checkout-btn');
    console.log(elementExists);
    if (elementExists && !this.addScript) {
      this.loadExternalScript("https://www.paypalobjects.com/api/checkout.js").then(() => {
        paypal.Button.render(this.paypalConfig, '#paypal-checkout-btn');
        this.paypalLoad = false;
      });
    }
  }

这是屏幕截图:- enter image description here

0 个答案:

没有答案