title: AngularJS: calling controller function inside ng-repeat
body: <p>My <strong>controller</strong> looks something like this:</p>
  
  <pre><code>controller('MonthlyCalendarController', ['$scope', function($scope) {
      $scope.counter = 0;
  
      $scope.increment = function() {
          $scope.counter++;
          console.log($scope.counter);
      }
   }])
  </code></pre>
  
  <p>My <strong>HTML</strong> looks something like this:</p>
  
  <pre><code> &lt;div ng-repeat="x in y track by $index" ng-init="increment()"&gt;
  counter: {{counter}}
   &lt;/div&gt;
  </code></pre>
  
  <p>My <strong>output</strong> looks like this every time. It only ever shows "1":  </p>
  
  <pre><code> &lt;div&gt;counter: 1&lt;/div&gt;
  </code></pre>
  
  <p>It console.logs() correctly; logging incremental numbers. However, my HTML output is only "1" every time. Just outputting $index will not suffice, as I'm doing other math in my <code>increment()</code> function, and <code>$scope.counter</code> will <code>!= $index</code>. Any ideas?</p>