在angular的另一个异步函数内部未发生函数调用

时间:2019-09-27 08:07:13

标签: angular razorpay

我正在使用razaorpay api,evrything工作正常,无论成功还是失败,我都希望捕获付款状态。

成功捕获到响应,我能够看到Razorpay付款API的成功响应。

我想使用PUT API将此响应发送到后端,但是函数调用未在响应处理程序内部触发

import {Component, OnDestroy, OnInit} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {WindowRef} from "../../../../shared-services/WindowRef";
import {Subscription} from "rxjs/Rx";
import {UpgradeServices} from "../upgrade.services";
import {PaymentCaptureObject, PlanInfo} from "../upgrade";

@Component({
    selector: 'app-purchase',
    templateUrl: './purchase.component.html',
    styleUrls: ['./purchase.component.scss']
})
export class PurchaseComponent implements OnInit, OnDestroy {

    rzp1: any;
    planId: number;

    planFetchSubscription: Subscription;
    fetchExamDataSubscription: Subscription;
    paymentCaptureSubscription: Subscription;
    paymentCaptureObject: PaymentCaptureObject;

    options: object;

    /**
     *
     * @param _route
     * @param winRef
     * @param _upgradeService
     * @param _commonServices
     * @param _globalservices

     */
    constructor(private _route: ActivatedRoute, private winRef: WindowRef,
                private _upgradeService: UpgradeServices, private) {

    }


    ngOnInit() { }


    hitMe(data) {
        console.log('HitMe', data); // no function call happened
        this.fetchExamDataSubscription = 
            this._upgradeService.capturePayment(data)
            .subscribe((res: any) => {
                    console.log(res.data)
                },
                err => {
                    console.log(err);
                }
            );
    }

    public initPay(): void {
        this.options = {
            "key": "my_key",
            "order_id": this._route.snapshot.params['orderId'],
            "amount": "2000",
            "name": " MARKET",
            "description": "Order #",

            "handler": function (response) {

                // alert(response.razorpay_payment_id); // this is captured
                this.paymentCaptureObject = {
                    "order_id": response["razorpay_order_id"],
                    "payment_id": response["razorpay_payment_id"],
                    "signature": response["razorpay_signature"]
                };
                this.hitMe(this.paymentCaptureObject); // not calling this func

            },

            "notes": {},
            "theme": {
                "color": "blue"
            }
        };
        this.rzp1 = new this.winRef.nativeWindow.Razorpay(this.options);
        this.rzp1.open();
    }



    ngOnDestroy() {

        if(this.paymentCaptureSubscription){
            this.paymentCaptureSubscription.unsubscribe();
        }

    }

}

服务

import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';

import {environment} from "../../../../environments/environment";

@Injectable()
export class UpgradeServices {
    apiUrl = environment.apiEndpoint;

    constructor(private http: HttpClient) {
    }

    capturePayment(data) {
        return this.http.put(this.apiUrl + '/payment_api', data);
    }

}

1 个答案:

答案 0 :(得分:1)

您应该使用箭头功能。

this.options = {
  "handler": response => {
    ...
    this.hitMe(this.paymentCaptureObject);
  }
}