Ionic 3 PayPal集成对象不是函数

Question

我正在与Woo Commerce Rest API联系以下订单。

我在图像中出现错误

所有付款方式都可以正常工作，只有PayPal失败。我在真实设备上使用远程设备调试器收到此控制台错误。

我的checkout.ts文件是：

import { Component } from '@angular/core';
 import { IonicPage, NavController, NavParams, AlertController } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import * as WC from 'woocommerce-api';
import { WoocommerceProvider } from '../../providers/woocommerce/woocommerce';
import { PayPal, PayPalPayment, PayPalConfiguration } from '@ionic-native/paypal/ngx';


@IonicPage({name: 'Checkout'})
@Component({
selector: 'page-checkout',
templateUrl: 'checkout.html',
})
export class CheckoutPage {

WooCommerce: any;
newOrder: any;
paymentMethods: any[];
paymentMethod: any;
billing_shipping_same: boolean;
userInfo: any;

constructor(public navCtrl: NavController, public navParams: NavParams, public storage: 
Storage, public alertCtrl: AlertController, private WP: WoocommerceProvider, public payPal: 
PayPal) {
this.newOrder = {};
this.newOrder.billing_address = {};
this.newOrder.shipping_address = {};
this.billing_shipping_same = false;

this.paymentMethods = [
  { method_id: "bacs", method_title: "Direct Bank Transfer" },
  { method_id: "cheque", method_title: "Cheque Payment" },
  { method_id: "cod", method_title: "Cash on Delivery" },
  { method_id: "paypal", method_title: "PayPal" }];

  this.WooCommerce = WP.init();

  this.storage.get("userLoginInfo").then( (userLoginInfo) => {

  this.userInfo = userLoginInfo.user;

  let email = userLoginInfo.user.email;

  this.WooCommerce.getAsync("customers/email/"+email).then( (data) => {

    this.newOrder = JSON.parse(data.body).customer;

  })

})

 }

 setBillingToShipping(){
 this.billing_shipping_same = !this.billing_shipping_same;

 if(this.billing_shipping_same)
{
  this.newOrder.shipping_address = this.newOrder.billing_address;
}

}

placeOrder(){

let orderItems: any[] = [];
let data: any = {};

let paymentData: any = {};

this.paymentMethods.forEach( (element, index) => {
  if(element.method_id == this.paymentMethod){
    paymentData = element;
  }
});


data = {
  payment_details : {
    method_id: paymentData.method_id,
    method_title: paymentData.method_title,
    paid: true
  },

  billing_address: this.newOrder.billing_address,
  shipping_address: this.newOrder.shipping_address,
  customer_id: this.userInfo.id || '',
  line_items: orderItems
};


if(paymentData.method_id == "paypal"){
 //payapal payment start

  this.payPal.init({
    PayPalEnvironmentProduction: "YOUR_PRODUCTION_CLIENT_ID",
    PayPalEnvironmentSandbox: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
  }).then(() => {
    // Environments: PayPalEnvironmentNoNetwork, PayPalEnvironmentSandbox, 
  PayPalEnvironmentProduction
    this.payPal.prepareToRender('PayPalEnvironmentSandbox', new PayPalConfiguration({
      // Only needed if you get an "Internal Service Error" after PayPal login!
      //payPalShippingAddressOption: 2 // PayPalShippingAddressOptionPayPal
    })).then(() => {

      this.storage.get("cart").then((cart) => {

        let total = 0.00;
        cart.forEach((element, index) => {

          if(element.variation){
            orderItems.push({ product_id: element.product.id, variation_id: 
   element.variation.id, quantity: element.qty });
            total = total + (element.variation.price * element.qty);
          } else {
            orderItems.push({ product_id: element.product.id, quantity: element.qty });
            total = total + (element.product.price * element.qty);
          }
        });

        let payment = new PayPalPayment(total.toString(), 'USD', 'Description', 'sale');
        this.payPal.renderSinglePaymentUI(payment).then((response) => {
          // Successfully paid

          alert(JSON.stringify(response));


          data.line_items = orderItems;
          //console.log(data);
          let orderData: any = {};

          orderData.order = data;

          this.WooCommerce.postAsync('orders', orderData.order).then((data) => {
            alert("Order placed successfully!");

            let response = (JSON.parse(data.body));

            this.alertCtrl.create({
              title: "Order Placed Successfully",
              message: "Your order has been placed successfully. Your order number is " + 
 response.order_number,
              buttons: [{
                text: "OK",
                handler: () => {
                  this.navCtrl.push('HomePage');
                }
              }]
            }).present();
          })

        })

      }, () => {
        // Error or render dialog closed without being successful
      });
    }, () => {
      // Error in configuration
    });
  }, () => {
    // Error in initialization, maybe PayPal isn't supported or something else
  });



 //paypale payment stop

} else {

  this.storage.get("cart").then( (cart) => {

    cart.forEach( (element, index) => {
      orderItems.push({
        product_id: element.product.id,
        quantity: element.qty
      });
    });

    data.line_items = orderItems;

    let orderData: any = {};

    orderData.order = data;

    this.WooCommerce.postAsync("orders", orderData).then( (data) => {

      let response = (JSON.parse(data.body).order);

      this.alertCtrl.create({
        title: "Order Placed Successfully",
        message: "Your order has been placed successfully. Your order number is " + response.order_number,
        buttons: [{
          text: "OK",
          handler: () => {
            this.navCtrl.setRoot('HomePage');
          }
        }]
      }).present();

    })

  })

}


 }

}

我认为这可能是Node.js模块的问题。我试图重新安装它们，但没有解决问题。也已经建立了APK文件，并将其直接安装到设备上，但没有成功。

Answer 1

我通过卸载/安装PayPal模块解决了此错误：

npm uninstall @ionic-native/paypal

npm install @ionic-native/paypal