title: Iterating over JSON properties
body: <p>I have successfully used the <code>$http</code> service in angular to pull a JSON object from another server using their API. I was able to then display the values like so...</p>
  
  <pre><code>&lt;div ng-controller="ApiController as ApiCtrl"&gt;
  {{ApiCtrl.Api.status}}
  {{ApiCtrl.Api.meta.count}}
  {{ApiCtrl.Api.data[0].nickname}}
  {{ApiCtrl.Api.data[0].account_id}}
  &lt;/div&gt;
  </code></pre>
  
  <p>This displays the values correctly but I am unable to display the Keys. I read around, <a href="https://stackoverflow.com/questions/19544904/ng-repeat-access-key-and-value-for-each-object-in-array-of-objects">here</a> and <a href="https://stackoverflow.com/questions/15127834/how-can-i-iterate-over-the-keys-value-in-ng-repeat-in-angular">here</a>. They explained that there is an ng-repeat that is set up to iterate through an object and pull the <code>keys</code> and <code>values</code> from it.</p>
  
  <pre><code>&lt;div ng-controller="ApiController as ApiCtrl"&gt;
    &lt;div&gt;
      &lt;div ng-repeat="(key, value) in Api"&gt;
          {{key}} : {{value}}
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <h2>For reference this is the ApiController</h2>
  
  <pre><code>function ApiController($http) {
      var vm = this;
      vm.Api = [];
  
      $http.get('...').success(function (data) {
      vm.Api = data;
      });
  };
  </code></pre>
  
  <h2>This is the Json that I requested</h2>
  
  <pre><code>{
  "status": "ok",
  "meta": {
      "count": 1
  },
  "data": [
      {
          "nickname": "Mitcha47",
          "account_id": 1001356515
      }
  ]
  }
  </code></pre>
  
  <p>The second method <code>ng-repeat="(key, value) in Api"</code> does not work and only shows * ngRepeat: (key, value) in Api * in the html </p>
  
  <p>Im quite confused about why it doesn't work and am not sure if its an incorrect use of syntax or from not understanding how the ng-repeat fully works. </p>
  
  <h2>Edit</h2>
  
  <p>After changing to div ng-repeat="(key,value) in ApiCtrl.Api" This was produced -></p>
  
  <pre><code> status : ok
   meta : {"count":1}
   data : [{"nickname":"Mitcha47","account_id":1001356515}]'
  </code></pre>
  
  <p>Which is okay, but not exactly the format to put into a table, which is the next step. Would this be fixed by using the <code>.fromJson</code> function? </p>
  
  <p>Do i include the ApiCtrl because multiple controllers can be used in each module and thus this keeps everything pointing to the correct values? </p>