0

情况是这样的——我正在一个基于角度的应用程序中使用万事达卡支付网关 api。该 api 为成功和错误进行回调,并在 script 标签的 data-error 和 data-success 属性中传递回调以加载 Mastercard api。

<script src="https://eu-gateway.mastercard.com/checkout/version/49/checkout.js" 
        data-error="errorCallback" 
        data-cancel="cancelCallback">
</script>

详情在这里

我有一个在 Firefox 和 Chrome 中运行良好但在 IE11 中完全失败的解决方案。我已经取消了所有 polyfills 导入的注释,但无论我尝试多少,都没有任何效果。

这是我到目前为止所做的:

  export class AppComponent implements OnInit {
    constructor(private ngZone: NgZone, private router:Router) {
    var _self = this;

    (<any>window).errorPaymentCallback = function(error){
      console.log(error);
    };

    (<any>window).cancelPaymentCallback = function(){
      console.log('cancel');
    };      
}

无论我尝试什么,都不会触发回调,而是 api 返回错误。有任何想法吗?

4

1 回答 1

1

您可以调度一个事件,然后将其捕获AppComponent

这是你如何做到这一点:

<script src="https://eu-gateway.mastercard.com/checkout/version/49/checkout.js" 
        data-error="errorCallback" 
        data-cancel="cancelCallback">
</script>

    <script type="text/javascript">
        function errorCallback(error) { document.dispatchEvent(new Event('payment-error', { bubbles: true })); }
        function cancelCallback() { document.dispatchEvent(new Event('payment-error', { bubbles: true })); }
        window.global = window;
      </script>

AppComponent

@HostListener('document:payment-error', ['$event'])
  paymentError(event){
    //do your work
  }
于 2018-10-04T13:13:43.887 回答