Currency wont change after Init

[BrutalCSkakan]

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]

Hi,

unfortunately this is a limitation of paypal sdk - it doesn't allow changing currency after initial load. I attempted to cleanup paypal's script, but was unable to do so. You have to do hard reload.

[marshall86]

Hi,

unfortunately this is a limitation of paypal sdk - it doesn't allow changing currency after initial load. I attempted to cleanup paypal's script, but was unable to do so. You have to do hard reload.

Hi I'm facing the same issue, how do you "hard reload" your component?

[Enngage]

It's not about reloading "my component".. its a limitation on PayPal's which I wasn't able to solve when working on this.

[marshall86]

i think maybe playing a bit with the "registerScript" and the "reinitialize" function it could be possible to change the currency on the fly.

If you set "registerScript" to false and in the ngOnInit() you initialize the paypalConfig with a currency than it's possible to change the currency but i managed to make it works only once.

This is the link https://www.paypal.com/sdk/js?client-id=sb&currency=EUR&commit=true that need to be generated to change the currency.

Could you please look in to this? I'd like to use your plugin. Are you still maintaining it?

Thanks and regards

[Enngage]

That doesn't work if some currency was already initialized. You simply can't change currency once PayPal API was already loaded. You have to hard reload the page.

[marshall86]

i see.. ok, are you still maintaining this project?

[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]

Thanks again for your feedback. Regarding styling is it possible to do something? I would like to change the overlay close button position and border.

Issue: #165

[Enngage]

Does PayPal API support styling?

[marshall86]

i managed in a way, i will reply on that issue ticket

[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.

[ProximaHaiz]

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?

[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>)

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.