Hello, I am currently working on integrating PayPal into an Angular 5 project. The code snippet below shows how I render PayPal buttons using a function:
ngAfterViewChecked(): void {
if (!this.addScript) {
this.addPaypalScript().then(() => {
this.abbonamenti.forEach((item, index) => {
paypal.Button.render(this.payPalConfig +index, '#paypal-checkout-btn' + index);
this.paypalLoad = false;
})
})
}
}
In the above code, different PayPal configurations need to be loaded for each button. Here is an example of such configuration:
payPalConfig = {
env: 'sandbox',
client: {
sandbox: 'AfOCNI-QeZrhkX2lT5e4xY0S2KTfgoDarEXwk4mkK0ge4EoeW25VN5cg5ZlNRrdJrWUctHWBGGbP4d2V',
production: 'AUiobQL_EOnmPB4ytmb5ZZHbLZT4hXk7UZgMzGwkd8HFIR6qZ5qJZM3JOb91O4y5frw4197ygPyfbor0'
},
commit: true,
// payment() is called when the button is clicked
payment: function(data, actions) {
// Make a call to the REST api to create the payment
return actions.payment.create({
payment: {
transactions: [
{
amount: { total: 40, currency: 'EUR' }
}
]
}
});
},
// onAuthorize() is called when the buyer approves the payment
onAuthorize: function(data, actions) {
// Make a call to the REST api to execute the payment
return actions.payment.execute().then(function() {
window.alert('Payment Complete!');
});
}
};
However, I am facing issues with concatenation or indexing in the function names. When trying to include '+ index' in the function name, it results in a syntax error. I'm struggling to solve this problem and feeling quite frustrated.