richnologies / ngx-stripe

Angular 6+ wrapper for StripeJS
MIT License
221 stars 75 forks source link

Change language dynamically #249

Closed benjaminmilcic closed 8 months ago

benjaminmilcic commented 8 months ago

I want to change language of the payment ui dynamically. I use ngx-translate.

I used the provided example on your website to integrate stripe. It works fine.

Now I have:

<ngx-stripe-elements [stripe]="stripe" [elementsOptions]="elementsOptions"> <ngx-stripe-payment [options]="paymentElementOptions" /> </ngx-stripe-elements>

`elementsOptions: StripeElementsOptions = { locale: this.translate.currentLang, clientSecret: null, appearance: { theme: 'flat', }, };

paymentElementOptions: StripePaymentElementOptions = { layout: { type: 'tabs', defaultCollapsed: false, radios: false, spacedAccordionItems: false, }, };

stripe = injectStripe( {{api_Key}} );

constructor( private translate: TranslateService, ) {} `

I try the following:

ngOnInit() { this.translate.onLangChange.subscribe((res) => { this.elementsOptions.locale = <StripeElementLocale>res.lang; ); }); }

But the language of the payment layout do not change.

You have any suggestion how to do that?

benjaminmilcic commented 8 months ago

Oh my god, sorry for starting an issue so fast. I get it to work now.

I added

@ViewChild(StripeElementsDirective) elements!: StripeElementsDirective;

and then

this.translate.onLangChange.subscribe((lang) => { this.elementsOptions.locale = <StripeElementLocale>lang.lang; this.elements.update(this.elementsOptions); });

Sorry again, for starting this issue!!!

richnologies commented 8 months ago

No worries. Congrats on finding the answer