Processing Paypal onAuthorize callback in Angular 4

Question

I can successfully load checkout.js in Angular 4 app, render the Paypal button, the new window appears, I confirm the payment, the payment is processed but I do not know how to setup onAuthorize callback to process the response in Angular 4 (like to show the success and store a payment record to MongoDb). Here is my code. I can see the first console.log containing the payment response but I cannot access the component's scope, so nothing after this first console.log is executed. I get no error in console. Even the console.log("successful!") is not processed.

onAuthorize: (data, actions) => {
            return actions.payment.execute().then(function(payment) {
                console.log("response = " + JSON.stringify(payment));
                this._alertService.success("The extension of subscription was succesfull!");
                this.user.contracts.push({
                        "acquired": new Date(payment.create_time), 
                        "price": payment.transactions[0].amount.total, 
                        "expires": new Date(this.user.expires.getFullYear()+this.selectedAccountExtensionOption.addedYears, this.user.expires.getMonth(), this.user.expires.getDate()) 
                        });
                console.log("successful!");     

            });
        },

Answer 1

Issue is that context (this) is not available in callback. The best solution would be to bind this as explained in answer to this question

Alternative solution is to emit custom event in PayPal callback (documentation here)

let event = new CustomEvent('dosomething', { data: "some data" });

and then catch this event in your component. Documentation here.

@HostListener('dosomething') 
onDoSomething(data) {
 console.log(data)
 // your rest of the implementation
}