Currency wont change after Init

Hello! Im calling the initConfig after each change in the DOM, I do this because I’m deciding on which item that I want to buy, and depending on the Item you can get different currencies.

I am logging out this.paypalConfig and the currency is updating just fine, and the paypal button loads for a split second.

But when I click the button I instantly get an error saying: Error: Unexpected currency: SEK passed to order.create. Please ensure you are passing /sdk/js?currency=SEK in the paypal script tag.

If I understand correctly, then the paypalConfig.currency is the URL currency, which I earlier stated that it’s already SEK.

How does it come that the config / button doesn’t update with the latest value of the currency field?

The data that Im sending in: { "currency": "SEK", "clientId": "XXXXXX", "advanced": { "commit": "true" }, "style": { "label": "paypal", "layout": "vertical" } }

With the payload of: [ { amount: { currency_code: 'SEK', value: '15', breakdown: { item_total: { currency_code: 'SEK', value: '15' } } }, items: [ { name: 'SAK NUMMER 2', quantity: '1', category: 'DIGITAL_GOODS', unit_amount: { currency_code: 'SEK', value: '15', }, } } ] } ]

[Enngage]

Yes, to some degree. I don’t have time to add new features, but will merge PRs and update to newer angular versions

[marshall86]

Regarding to the currency change i found a way as well. I dynamically inject the ngx-paypal button in the page and every time i change currency i clear the button container, remove all the Paypal’s reference from the DOM and show again the button with a new config. If someone need it I can explain it better.

Hi! @marshall86 I met the same issue with changing currency. Could you please explain how have you implemented it?

Sure, even though i’m still testing it.

I have a form input for the amount, a select with the currencies and a component reference (<ng-container #paypal></ng-container>)

First thing I do is to initialize the button onInit(). so using the resolver function I pass to the component reference my paypal button component which will be in charge to show the button (using the configuration suggested by the owner of ngx-paypal) and get the feedback from paypal regarding the status of the transaction and eventually pass this status to the parent component.

Through the component reference instance properties (amount, currency, orderData and paypalClientId) I pass the data that are needed and I subscribe to the component reference instance to get the results emitted from the paypal button.

Every time the user change a currency I do this:

initPaypal(): void {

if (this.form.valid) {

  this.submitAttempt = true;
  this.container.clear();

  // removing all reference to paypal
  const query = new RegExp('paypal|__zoid_|__post_robot_', 'i');
  Object.keys(window)
    .filter(k => query.test(k))
    .map(v => {
      delete window[v];
      return window[v];
    })
    .map((_v, i) => {
      if (i === 0) {
        return this.createPaypalComponent(false);
      }
    });

}

}

Basically, we need to remove every reference to the previous paypal button so it can be reinitialized. Until the user doesn’t input an import in the form the paypal button is disabled, when this change “onchange()” on the amount field I call again initPaypal() and the button will be enabled

I hope I have been clear with my explanation, it’s more difficult to explain that it actually is.