CODEWITHSUNDEEP
javascriptangularjsjsonangularjs-ng-repeat
Dhana
Dhana

Reputation: 723

How to iterate and get the json values using angularjs ng-repeat?

I want to iterate and get the name values: test01, test02 and test03 on my ng-repeat for my given json. How can I get it using ng-repeat ? Please let me know and thanks in advance.

Fiddle is available.

Upvotes: 0

Views: 54

Answers (4)

illeb
illeb

Reputation: 2947

Something like this will do the trick:

<div ng-controller="MyCtrl">
  <table>
     <tr ng-repeat="value in data.Test">
        <td> {{value.Testing.static.name}} </td> 
     </tr>
  </table>
</div>

If you are sure that the hierarchy of your JSON will remain the same, then there is no need to iterate in the json properties by using (key, value) in data.

Updated fiddle.

Upvotes: 1

tratto
tratto

Reputation: 252

You do not need the (key, value) here, just 

<div ng-controller="MyCtrl">
 <table>
   <tr ng-repeat="val in data.Test">
      <td> {{val.Testing.static.name}} </td> 
    </tr>
  </table>
</div>

key[0] - is just the first letter of the key "Test"

Upvotes: 1

Mohit Tanwani
Mohit Tanwani

Reputation: 6628

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.data = {
	"Test": [{
		"Testing": {
			"static": {
				"name": "test01"
			},
			"testboolean": true
		}
	}, {
		"Testing": {
			"static": {
				"name": "test02"
			},
			"secondstatic": "yes"
		}
	}, {
		"Testing": {
			"static": {
				"name": "test03"
			}
		}
	}]
};

};
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
  
 <table>
   <tr ng-repeat="d in data.Test">
      <td> {{d.Testing.static.name}} </td> 
    </tr>
  </table>
</div>

Upvotes: 1

Evt.V
Evt.V

Reputation: 179

You can do it like this:

<tr ng-repeat="(key, value) in data.Test">
  <td> {{value.Testing.static.name}} </td>
</tr>

https://jsfiddle.net/nh5zxoka/3/

Upvotes: 2

Related Questions