angular - angularの他の非同期関数内で関数呼び出しが発生していません

Question

私はrazaorpay apiを使用しています。すべてが正常に機能しており、成功または失敗して支払いステータスを取得したいと考えています。

応答が正常にキャプチャされ、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);
    }

}