I am having this issue with Angular 1.6 Controllers and Stripe. I have a controller that changes the view based on a step varabiable. I am changing the step based on a successfull callback from Stripe like so:

stripe.createToken(card).then((result) => {

                     if (result.error) {
                         // Inform the customer that there was an error.
                         var errorElement = document.getElementById('card-errors');
                         errorElement.textContent = result.error.message;
                      } else {
                        // Send the token to your server.
                        stripe_token = result.token;
                        //Change step
                        $scope.step = step;
                      }
                })
                .catch( e =>{
                    console.log("Error");
                });

The problem is when the step is assigned inside the callback, the value is assigned but the view is not updated. Any ideas to why this only happens with Stripe callbacks in Angular?

3 Answers

0
Devin Dixon On

$scope.$apply(); Has to be used in the callback.

1
Community On

I don't have enough reputation to add a comment to your own answer, but I just wanted to add that it's better practice to pass the appropriate function to $scope.apply than simply calling it with zero arguments.

0
Jeff Johny On

Use $http service provided by AngularJs. This will automatically trigger $scope.$digest once a request returns

Doc: https://docs.angularjs.org/api/ng/service/$http