How to iterate over the keys and values with ng-repeat in AngularJS? How to iterate over the keys and values with ng-repeat in AngularJS? angularjs angularjs

How to iterate over the keys and values with ng-repeat in AngularJS?


How about:

<table>  <tr ng-repeat="(key, value) in data">    <td> {{key}} </td> <td> {{ value }} </td>  </tr></table>

This method is listed in the docs: https://docs.angularjs.org/api/ng/directive/ngRepeat


If you would like to edit the property value with two way binding:

<tr ng-repeat="(key, value) in data">    <td>{{key}}<input type="text" ng-model="data[key]"></td></tr>


I don't think there's a builtin function in angular for doing this, but you can do this by creating a separate scope property containing all the header names, and you can fill this property automatically like this:

var data = {  foo: 'a',  bar: 'b'};$scope.objectHeaders = [];for ( property in data ) {  $scope.objectHeaders.push(property); }// Output: [ 'foo', 'bar' ]