Question

我一直在开发一个电子商务网站，但我陷入了困境。我正在使用Stripe付款，除了创建令牌后的数据绑定外，一切正常。这是我的控制器

app.controller('shoppingCartController', ['$scope', '$http', '$sce', 'stripe', '$window', function ($scope, $http, $sce, stripe, $window) {

        $window.Stripe.setPublishableKey('pk_test_saiYYlyCNgO2yZq6Mu******');

        $scope.createToken = function () {
            var expire = $scope.master[0].expire.split('/');
            if ($scope.userDetail.$valid === true) {
                $window.Stripe.card.createToken({
                    number: $scope.master[0].card,
                    cvc: $scope.master[0].cvv,
                    exp_month: expire[0],
                    exp_year: expire[1],
                }, $scope.makepayment);

            }
        }

        $scope.makepayment = function (status, response) {
            if (response.error) {
                $scope.handleStripeCallback(response);
            } else {
                // response contains id and card, which contains additional card details
                var data = {token: response.id, data: $scope.cartData};

                $http.post('make_payment', data).success(function (data) {
                    if (data.status) {
                        $scope.stripePaymentMessage = data.message;
                        $scope.stripePaymentMessageClass = "success";
                    } else {
                        $scope.stripePaymentMessage = data.message;
                        $scope.stripePaymentMessageClass = "danger";
                    }

                })
            }

        }

        $scope.handleStripeCallback = function (response) {
            //alert(response.error.message);
            $scope.stripChargeRequest = true;
            $scope.stripePaymentMessage = response.error.message;
            $scope.stripePaymentMessageClass = "danger";
        }



    }]);

在我看来，我正在尝试使用此代码处理错误或成功消息

<div ng-show="stripChargeRequest ">
    <div class="alert alert-{{stripePaymentMessageClass}}" role="alert" >
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        {{stripePaymentMessage}}
    </div>
</div>

我的问题是：stripChargeRequest angular变量包含正常范围绑定的true / false但是当我尝试通过调用$ scope.createToken（）创建一个令牌时，它不起作用。我想我在调用回调函数$ scope.makepayment（）时忘记了一些事情。幸运的是，它在控制器的范围内工作。我可以在控制器中查看条带请求后看到错误，但它没有在视图中显示。请建议我这样做的正确方法。提前致谢。

Answer 1

条带回调超出了角度，因此您需要在更新范围时使用$apply告诉角度，以便它可以运行摘要来更新视图

示例：

   $scope.handleStripeCallback = function (response) {
        //alert(response.error.message);
        $scope.stripChargeRequest = true;
        $scope.stripePaymentMessage = response.error.message;
        $scope.stripePaymentMessageClass = "danger";
        $scope.$apply(); // tell angular to update view
    }

$ scope不是视图

1 个答案: