Question

我正在构建Angular应用程序，并在其中添加PayPal结帐。我已经成功地将其集成到在线文档中。现在，我想在提交之前添加一些Angular表单验证，我想查看用户是否在某些输入字段中输入了一些值，然后基于此启动显示验证错误消息的PayPal工作流程。我正在关注以下文档：https://developer.paypal.com/docs/checkout/integration-features/validation/#synchronous-validation

问题是，每当我尝试调用actions.disable();（应该会停止打开付款方式的正常工作流程）时，都会出现以下错误：Uncaught Error: TypeError: Cannot read property 'disable' of undefined。我需要帮助来弄清楚如何以某种方式停止错误的正常工作流程，我已经知道如何添加验证。

这是我的控制器的外观：

paypalConfig = {
  env: 'sandbox', // sandbox or production
  client: {
    sandbox: this.PAYPAL_SANDBOX_CLIENTID,
    production: this.PAYPAL_PROD_CLIENTID
  },
  commit: true,
  payment: (data, actions) => {
    return actions.payment.create({
        payment: {
            transactions: [
                { amount: { total: this.amount, currency: this.currency } }
            ]
        }
    });
  },
  onInit: (data, actions) => {
    console.log(5555555)

    // Disable the buttons
    actions.disable();
  },
  onClick: (data, actions) => {
    console.log(4444);

    // Disable the buttons
    actions.disable();
  },
  onAuthorize: (data, actions) => {
    return actions.payment.execute().then((payment) => {
        // do something when payment is successful
    });
  }
}; 

ngAfterViewChecked () {
  if (!this.addScript && this.navbarOptions.donate) {
    this.addPaypalScript().then(() => {
      paypal.Button.render(this.paypalConfig, '#paypal-checkout-btn');
    });
   }
}

addPaypalScript() {
  this.addScript = true;
  return new Promise((resolve, reject) => {
    const scriptTagElement = document.createElement('script');
    scriptTagElement.src = 'https://www.paypalobjects.com/api/checkout.js';
    scriptTagElement.onload = resolve;
    document.body.appendChild(scriptTagElement);
    //document.querySelector('#paypal-checkout-btn').setAttribute('style', 'pointer-events: none; opacity: 0.5');
  });
 }

还有我的HTML：

<div class="pt-2" id="paypal-checkout-btn"></div>

向Angular PayPal添加验证

0 个答案: