JSFiddle - React, Tailwind, and code Playground
HTML
<table ng-app="MyApp" ng-controller="MyCtrl" class="border: 1px">
<tbody>
<tr data-ng-repeat="dayData in storeDataModel.storedata[1].data.dayData">
<td>{{dayData.date}}</td>
<td>{{dayData.cost}}</td>
<td>{{dayData.sales}}</td>
<td>{{dayData.revenue}}</td>
<td>{{dayData.employees}}</td>
<td>{{dayData.employeeHoursSum}}</td>
</tr>
</tbody>
</table>
JavaScript
angular.module('MyApp', []).controller('MyCtrl', function ($scope) {
$scope.storeDataModel = {
"metadata":{
"storesInTotal":"25",
"storesInRepresentation":"2"
},
"storedata":[
{
"store" : {
"storeId" : "1000",
"storeName" : "Store 1",
"storePhone" : "+46 31 1234567",
"storeAddress": "Some street 1",
"storeCity" : "Gothenburg"
},
"data" : {
"startDate" : "2013-07-01",
"endDate" : "2013-07-02",
"costTotal" : "100000",
"salesTotal" : "150000",
"revenueTotal" : "50000",
"averageEmployees" : "3.5",
"averageEmployeesHours" : "26.5",
"dayData" : [
{
"date" : "2013-07-01",
"cost" : "25000",
"sales" : "15000",
"revenue" : "4000",
"employees" : "3",
"employeesHoursSum" : "24"
},
{
"date" : "2013-07-02",
"cost" : "25000",
"sales" : "16000",
"revenue" : "5000",
"employees" : "4",
"employeesHoursSum" : "29"
}
]
}
},
{
"store" : {
"storeId" : "2000",
"storeName" : "Store 2",
"storePhone" : "+46 8 9876543",
"storeAddress": "Big street 100",
"storeCity" : "Stockholm"
},
"data" : {
...