title: AngularJS Scope not updating in view after async call
body: <p>I am having trouble updating my scope on the front-end while making a request to an API. On the backend I can see that the value of my $scope variable is changing but this is not being reflected in the views.</p>
  
  <p>Here is my controller.</p>
  
  <pre><code>Controllers.controller('searchCtrl', 
   function($scope, $http, $timeout) {
     $scope.$watch('search', function() {
        fetch();
     });
  
   $scope.search = "Sherlock Holmes";
  
   function fetch(){
     var query = "http://api.com/v2/search?q=" + $scope.search + "&amp;key=[API KEY]&amp;format=json";
      $timeout(function(){
        $http.get(query)
        .then(function(response){ 
          $scope.beers = response.data; 
          console.log($scope.beers);
        });
      });  
   }
  });
  </code></pre>
  
  <p>Here is a snippet of my html</p>
  
  <pre><code>&lt;div ng-if="!beers"&gt;
    Loading results...
  &lt;/div&gt;
  &lt;p&gt;Beers: {{beers}}&lt;/p&gt;
  &lt;div ng-if="beers.status==='success'"&gt;
  
    &lt;div class='row'&gt;
      &lt;div class='col-xs-8 .col-lg-8' ng-repeat="beer in beers.data track by $index" ng-if="beer.style"&gt;
      &lt;h2&gt;{{beer.name}}&lt;/h2&gt;          
      &lt;p&gt;{{beer.style.description}}&lt;/p&gt;
      &lt;hr&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div ng-if="beers.status==='failure'"&gt;
    &lt;p&gt;No results found.&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I've tried several solutions including using <strong>$scope.$apply();</strong> but this just creates the common error</p>
  
  <blockquote>
    <p>Error: $digest already in progress</p>
  </blockquote>
  
  <p>The following post suggested to use <strong>$timeout</strong> or $asyncDefault
  <a href="https://stackoverflow.com/questions/12729122/angularjs-prevent-error-digest-already-in-progress-when-calling-scope-apply">AngularJS : Prevent error $digest already in progress when calling $scope.$apply()</a></p>
  
  <p>The code I have above uses $timeout and I have no errors but still the view is not updating.</p>
  
  <p>Help appreciated</p>