title: How to populate a table with AngularJS
body: <p>I have a table:</p>
  
  <pre><code>&lt;h4&gt;Table of Results&lt;/h4&gt;
  &lt;table class="table table-striped"&gt;
      &lt;thead&gt;
         &lt;tr&gt;
            &lt;th scope="col"&gt;Name&lt;/th&gt;
            &lt;th scope="col"&gt;Value&lt;/th&gt;
            &lt;th scope="col"&gt;Sub-Name&lt;/th&gt;
         &lt;/tr&gt;
       &lt;/thead&gt;
       &lt;tbody&gt;
         &lt;tr ng-repeat="object in results&gt;
            &lt;td&gt;{{object.field1}}&lt;/td&gt;
            &lt;td&gt;{{object.field2}}&lt;/td&gt;
            &lt;td&gt;{{object.field3}}&lt;/td&gt;
         &lt;/tr&gt;
       &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>And I have a controller:</p>
  
  <pre><code>angular.module('app', [])
  
  .controller("Ctrl",['$scope', function ($scope) { 
  
   $scope.BtnIndex;
   $scope.results = [];
  
   $scope.selectBtn = function (index, model1, model2) {
       if (index == $scope.BtnIndex)
           $scope.BtnIndex = -1;
       else {
           $scope.newItem = {
               field1 : model2.name,
               field2 : model2.val,
               field3 : model1.name
           }
           $scope.results.push($scope.newItem);
        }
  };
  </code></pre>
  
  <p>I can't work out why the table is not populating with the data.  I have checked the console and it is showing the data, as I expected, but it just isn't populating the table.</p>
  
  <p>I'm expecting the answer to be right in front of me, but I can't see it.</p>