$scope 未绑定视图中的数据答案

【问题标题】：$scope is not binding data in view$scope 未绑定视图中的数据
【发布时间】：2015-05-12 20:22:23
【问题描述】：

我一直在开发一个电子商务网站，但我陷入了困境。我正在使用 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 角度变量包含具有正常范围绑定的 true/false，但是当我尝试通过调用 $scope.createToken() 创建令牌时它不起作用。我想我在调用回调函数 $scope.makepayment() 时忘记了一些东西。幸运的是，它在控制器的范围内工作。我可以在控制器中的条带请求后看到错误，但它没有显示在视图中。请建议我这样做的正确方法。提前致谢。

【问题讨论】：

标签： angularjs

【解决方案1】：

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

例子：

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

【讨论】：