Question: In my Angular 1.4.X app, I have some code like this in the controller

```
function submitForm() {
    $scope.submissionInProgress = true;
    myService.veryExpensiveOperation();
    $scope.submissionInProgress = false;
}

```

In the view, I try to use `$scope.submissionInProgress` to show/hide a spinner while `veryExpensiveOperation()` (a synchronous operation) is in progress. 

```
<div ng-show="submissionInProgress" class="spinner">
    Please wait...
</div>

```

However, what actually happens is that the spinner isn't displayed until `veryExpensiveOperation()` has almost completed. In other words, it seems there's a delay of a few seconds between when `$scope.submissionInProgress = true` is called, and when the spinner is actually shown.

Answer: 
Solution
--------

I fixed this using `$timeout` like so:

```
function submitForm() {
    $scope.submissionInProgress = true;

    $timeout(function() {
        myService.veryExpensiveOperation();
        $scope.submissionInProgress = false;
    });
}

```
you can also use callbacks

### callback

```
function submitForm() {
    $scope.submissionInProgress = true;
    myService.veryExpensiveOperation(function() {
        $scope.submissionInProgress = false;
    });
}

```

and the function veryExpensiveOperation:

```
veryExpensiveOperation = function(callback) {
...
success: function() {
   if(typeof callback == "Function") {
      callback();
   }
}
...
}

```