I currently have an array of objects structured as follows:
expMonthByCat:
{Food: [some values],
Clothing: [some values]
}
In conjunction with this data, there exists a table formatted in the following manner:
<tr data-ng-repeat="category in labels">
<th scope="row">{{category}}</th>
<td data-ng-repeat="expCat in expMonthByCat">{{expCat}}</td>
</tr>
An issue arises when trying to pass the variable category within the context of
<td data-ng-repeat="expCat in expMonthByCat">category contains keys such as Food and Clothing, among others, present inside expMonthByCat.
I've attempted solutions such as:
<td data-ng-repeat="expCat in expMonthByCat.category"><td data-ng-repeat="expCat in expMonthByCat">{{expCat.category}}</td>If anyone could provide guidance or assistance, it would be greatly appreciated. Thank you!
UPDATE
Upon utilizing
<td data-ng-repeat="expCat in expMonthByCat track by $index">In contrast, employing
<td data-ng-repeat="expCat in expMonthByCat.Food track by $index">{{expCat}}</td>How can I ensure that the table displays its respective values accurately?
Below is a snippet of my JavaScript code for reference:
$scope.expMonthByCat = {};
for (z = 0; z < $scope.labels.length; z++) {
$scope.expMonthByCat[$scope.labels[z]] = new Array(12);
for (x = 0; x < 12; x++) {
$scope.expMonthByCat[$scope.labels[z]][x] = 0;
}
}
for (x = 0; x < 12; x++){
for (i = 0; i < response.data[2].length; i++) {
$scope.labels.forEach(function (k) {
if(response.data[2][i].category == k){
if (response.data[2][i].expMonth == x + 1 && response.data[2][i].expYear == currentYear){
var expByCat = response.data[2][i].expAmount;
$scope.expMonthByCat[k][x] = parseFloat(Number(expByCat).toFixed(2));
}
}
});
}
}