 <p>other solution for your question.</p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-js lang-js prettyprint-override"><code>var app = angular.module("testApp", []); app.controller('testCtrl', function($scope){ $scope.data = [{ "fleetcheckitemid": "1", "checkitemdesc": "Engine oil level", "answers": [{ "fleetcheckid": "1", "checkvaluedesc": "Ok" }, { "fleetcheckid": "2", "checkvaluedesc": "Low" }, { "fleetcheckid": "3", "checkvaluedesc": "Top-Up Required" }] }, { "fleetcheckitemid": "2", "checkitemdesc": "Water level", "answers": [{ "fleetcheckid": "1", "checkvaluedesc": "Ok" }, { "fleetcheckid": "2", "checkvaluedesc": "Low" }, { "fleetcheckid": "3", "checkvaluedesc": "Top-Up Required" }] }, { "fleetcheckitemid": "3", "checkitemdesc": "Brake fluid level", "answers": [{ "fleetcheckid": "1", "checkvaluedesc": "Ok" }, { "fleetcheckid": "2", "checkvaluedesc": "Low" }, { "fleetcheckid": "3", "checkvaluedesc": "Top-Up Required" }] }]; angular.forEach($scope.data,function(value,key){ console.log(value.fleetcheckitemid); console.log(value.checkitemdesc); angular.forEach(value.answers,function(v,k){ console.log(v.fleetcheckid); console.log(v.checkvaluedesc); }); }); });</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"&gt;&lt;/script&gt; &lt;div ng-app="testApp" ng-controller="testCtrl"&gt; &lt;/div&gt;</code></pre> </div> </div> </p>