Question

我试图在一个角度项目中整合条纹时遇到了奇怪的问题。我在我的控制器中运行条带方法，我想从回调中更新各种范围值。我认为有一些范围问题我不理解。我可以在回调中控制记录我的范围变量，再次更新它们和控制台日志以查看新值。但是，如果我尝试在回调之外再次记录变量，我会得到旧值，然后新值不会进入我的视图。我也尝试将$ scope原语移动到$ scope对象无济于事。这是一个例子。

app.controller('checkoutCtrl', function ($scope) {

    // default values
    $scope.receipt = {};
    $scope.paymentSuccess = false;
    $scope.saveCardForFuture = true;

    Stripe.card.createToken($scope.card, function (status, res) {

        $scope.receipt = res.data;
        $scope.paymentSuccess = true;

        if ($scope.saveCardForFuture === true) {
            // save card token
        }

        // tests cases
        console.log($scope.saveCard)       //logs undefined
        console.log($scope.receipt)        //logs the response data
        console.log($scope.paymentSuccess) //logs true 
    });

    // timeout long enough to wait for stripe response
    $timeout(function() {
        console.log($scope.receipt);       //logs {}
        console.log($scope.paymentSuccess) //logs false
    }, 1000);

});

注意：Stripe不作为控制器依赖项传递，我只是从我的html索引页面全局包含它。我还没有找到一种方法将其作为可注射的依赖项包括在内，但必须有更好的方法。

Answer 1

你在条纹回调中留下了angularjs世界。用$ scope封闭回调块。$ apply（fn）;

一些好的阅读：http://jimhoskins.com/2012/12/17/angularjs-and-apply.html

app.controller('checkoutCtrl', function ($scope) {

    // default values
    $scope.receipt = {};
    $scope.paymentSuccess = false;
    $scope.saveCardForFuture = true;

    Stripe.card.createToken($scope.card, function (status, res) {
        $scope.$apply(function () {
            $scope.receipt = res.data;
            $scope.paymentSuccess = true;

            if ($scope.saveCardForFuture === true) {
                // save card token
            }

            // tests cases
            console.log($scope.saveCard)       //logs undefined
            console.log($scope.receipt)        //logs the response data
            console.log($scope.paymentSuccess) //logs true 
        });
    });

    // timeout long enough to wait for stripe response
    $timeout(function() {
        console.log($scope.receipt);       //logs {}
        console.log($scope.paymentSuccess) //logs false
    }, 1000);

});

无法完全访问条带回调中的$ scope变量？

1 个答案: