title: Update view from while loop with in angular controller
body: <p>I am in the process of learning angular.js and would like to know if there is a way to update the view from a while loop. I have a button that is clicked that calls a function with a while loop that increments a variable for each iteration. There is a button to cancel the loop. I have read and somewhat understand the $apply/$digest loop that angular uses to update the view. I have also tinkered with the $interval and had it working, but in the end its not fast enough for what i want to eventually do with this. </p>
  
  <p>So is there a way to get the variable that is incremented in the while loop printed to the screen. Here is the code I have so far.</p>
  
  <p>LearningAngular.js</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>    var myApp = angular.module("myApp", []);
      myApp.controller("myController", myController);
      
      function myController($scope, $interval) {
          var count = true;
          $scope.counter = 0;
      
          $scope.start_count = function(){
              //promise = $interval(function() {
              //   $scope.counter++;
              //},1);
              while (count == true) {
                  $scope.counter++;
              }   
          }
         
         $scope.stop_counting = function(){
              //$interval.cancel(promise);
              count = false;
          }
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;!DOCTYPE html&gt;
      
      &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Learning Angular&lt;/title&gt;
          &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      
      &lt;body ng-app="myApp" ng-controller="myController"&gt;
          
          &lt;button ng-click="start_count()"&gt;Start Counting&lt;/button&gt;&lt;br&gt;
          Counter: &lt;span&gt;{{counter}}&lt;/span&gt;&lt;br&gt;
          
          &lt;button ng-click="stop_counting()"&gt;Stop Counting&lt;/button&gt;
      
      &lt;/body&gt;
      &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>edit</strong>
  what happens is when the ng-click calls the <code>start_count()</code> function the code goes into the while loop. If I have my debugger open in chrome and click the button then put a break point at the <code>$scope.counter++</code> I can see that the counter is being incremented. It just isn't displaying on the screen. I don't want to use the setInterval or $interval functions provided as they aren't fast enough for what I intend to use the code for. In a nut shell I will be comparing simulated power ball numbers chosen by a user to one the computer draws. The setInterval and $interval functions will be good for this but will take to long to get any where. The computer can check a couple million in a few seconds but not if it is restricted with an interval. </p>