如何在Angular中避免braintree.setup的多个实例？

我有一个模式窗口的简单布伦特里付款方式：如何在Angular中避免braintree.setup的多个实例？

$scope.displayModalBraintree = function() { 
    $scope.modal = 'modal_payment_form.html', $scope.$on('$includeContentLoaded', function() { 
     braintree.setup('tokenStringFromServer', 'paypal', { 
      container: 'paypal', 
      locale: 'da_dk', 
      onReady: function (integration) { 
       console.log('ready', integration) 
      } 
     }) 
    }) 
})

点击一个按钮执行displayModalBraintree，和第一次，一切都很好。然而，点击第二个按钮会生成两个Paypal按钮，并且日志说准备就绪。

我试图使用拆解来销毁braintree.setup实例，如https://github.com/braintree/braintree-web/issues/29#issuecomment-137555915所解释的，尽管它没有任何区别。

来源

2015-10-08 longtimejones

^{完全披露：我在布伦特里工作。如果您有任何其他问题，请随时致电contact support。}

每当您拨打$scope.displayModalBraintree时，您正在设置一个新的收听者$includeContentLoaded。由于这些听众没有清理干净，所以每次都创建一个新听众。所以第二次运行$scope.displayModalBraintree时，它会调用braintree.setup两次。你第三次运行它，因为现在有三个听众，它运行三次。

一个解决办法是设置听者$scope.displayModalBraintree之外，像这样：

var clientToken, braintreeVault; 

$scope.$on('$includeContentLoaded', function() { 
    braintree.setup(clientToken, 'paypal', { 
    container: 'paypal', 
    onReady: function (integration) { 
     braintreeVault = integration; 
    } 
    }) 
}); 

$scope.displayModalBraintree = function() { 
    $scope.getToken().then(function (token) { 
    clientToken = token; 
    $scope.modal = 'modal_payment_form?' + (new Date().getTime()); 
    }) 
};

另一种选择是摧毁听者的模式被加载后，但我认为它更有意义解压退出$scope.displayModalBraintree功能。

来源

2015-10-09 16:34:59 BladeBarringer

_{我为布伦特里工作。}

自从发布Github评论以来，我们已经更新了关于teardown的文档。尝试在您的拆解功能中设置integration = null，如code snippet here中所示。如果这不起作用，我建议发布代码teardown以帮助我们诊断您的问题。

来源

2015-10-08 19:01:58

谢谢'整合= null'没有帮助，我在https://jsfiddle.net/7h242u3q/1/ 第一次公布了非工作示例显示模式窗口，日志输出： '准备对象{拆卸=函数（）} 拆卸对象{拆卸=函数（）} 归零null' 第二时间显示模式窗口，日志输出： '准备对象{拆卸=函数（）} 准备对象{teardown = function（）} teardown对象{teardown = function（）} null null' – longtimejones

我需要一个商家的工作流来添加多个支付细节..但是当我打电话通过给予merchant_id给客户端的client_token，我得到的只是以前添加的没有用于输入新细节的表单的付款方法 –

如何在Angular中避免braintree.setup的多个实例？

回答

相关问题