unable to integrate razorpay in angular 4

Question

I am trying to integrate the razorPay payment gateway.

  payNow( ) { 
        
          var options = {
            "key": "rzp_test_dveDexCQKoGszl",
            "amount":((this.buyNow==1)?this.shared.totalAmountWithDisocuntBuyNow:this.shared.totalAmountWithDisocunt)*100, // 2000 paise = INR 20
            "name": " MARKET",
            "description": "Order #",
        
            "handler": function (response){
                console.log(response);
                alert(response.razorpay_payment_id);
                this.paid();
                this.shared.addOrder(this.buyNow,response.razorpay_payment_id);     
         
              
               },
            "prefill": {
                "name":  this.shared.orderDetails.billing_firstname + " " + this.shared.orderDetails.billing_lastname,
                "email": this.shared.customerData.customers_email_address,
                "contact": this.shared.customerData.customers_telephone,
           
            },
            "notes": {
                "address": this.shared.orderDetails.billing_street_address+', '+this.shared.orderDetails.billing_city+', '+this.shared.orderDetails.billing_state+' '+this.shared.orderDetails.billing_postcode+', '+this.shared.orderDetails.billing_country 
            },
            "theme": {
                "color": "blue"
            }
        };
        var rzp1 = new Razorpay(options);

       rzp1.open();
  
     // body...
   } 
   paid()
   {alert();}

I have defined in handler the callback function. But issue is it successfully logs the response and alerts it too but it does not calls this.paid() or this.shared.addOrder(this.buyNow,response.razorpay_payment_id);

There are no console errors nothing. It just does not calls any of above methioned functions.

Answer 1

Call the handler function by binding it to function using following syntax

"handler":this.shared.addOrder.bind(this,this.buyNow) ,

This worked.