回调中的 Braintree 下降和 Angular $scope 不起作用
Braintree Drop in callback and Angular $scope doesn't work
我正在尝试在 angular 控制器中使用 UI 中的 braintree drop,例如
https://jsfiddle.net/6jmkwode/
function PaymentCtrl($scope) {
$scope.hasCalledBack = 'Nope';
braintree.setup('BRAINTREE_KEY',
'dropin', {
container: 'dropin',
onPaymentMethodReceived: function (obj) {
$scope.hasCalledBack = 'YEP!';
alert('Did the scope variable change? No? Well it should have....');
}
});
}
但是 $scope.hasCalledBack 即使警报触发,回调中的 $scope.hasCalledBack 也从未改变。
只需用 $scope.$apply() (nice article 包装您的回调代码即可):
...
onPaymentMethodReceived: function (obj) {
$scope.$apply(function() {
$scope.hasCalledBack = 'YEP!';
alert('Did the scope variable change? Yes!');
});
}
...
$apply() is used to execute an expression in angular from outside of the angular framework. (For example from browser DOM events, setTimeout, XHR or third party libraries). Because we are calling into the angular framework we need to perform proper scope life cycle of exception handling, executing watches.
查看更新 Demo。
我正在尝试在 angular 控制器中使用 UI 中的 braintree drop,例如
https://jsfiddle.net/6jmkwode/
function PaymentCtrl($scope) {
$scope.hasCalledBack = 'Nope';
braintree.setup('BRAINTREE_KEY',
'dropin', {
container: 'dropin',
onPaymentMethodReceived: function (obj) {
$scope.hasCalledBack = 'YEP!';
alert('Did the scope variable change? No? Well it should have....');
}
});
}
但是 $scope.hasCalledBack 即使警报触发,回调中的 $scope.hasCalledBack 也从未改变。
只需用 $scope.$apply() (nice article 包装您的回调代码即可):
...
onPaymentMethodReceived: function (obj) {
$scope.$apply(function() {
$scope.hasCalledBack = 'YEP!';
alert('Did the scope variable change? Yes!');
});
}
...
$apply() is used to execute an expression in angular from outside of the angular framework. (For example from browser DOM events, setTimeout, XHR or third party libraries). Because we are calling into the angular framework we need to perform proper scope life cycle of exception handling, executing watches.
查看更新 Demo。