JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<div ng-app>
<div ng-controller="MyCtrl">
<table>
<tr ng-repeat="item in tableData">
<td>{{item.thing}}</td>
<td>{{item.price|currency}}</td>
<td>{{item.amount}}</td>
</tr>
</table>
</div>
</div>
JavaScript
function MyCtrl($scope) {
$scope.data = {
'widget': {
'1': 10,
'2': 5
}
};
var tableData = [];
for (item in $scope.data) {
var thing = item;
for (subitem in $scope.data[thing]) {
tableData.push({
thing: thing,
price: subitem,
amount: $scope.data[thing][subitem]
});
}
}
$scope.tableData = tableData;
}