Question

这里是情况-我正在基于角度的应用程序中使用万事达卡支付网关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>

Details here。

我有一个在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返回错误。有什么想法吗？

Answer 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
  }

如何从全局函数访问角分量函数-请与IE11兼容

1 个答案: