Como gerar tabela aninhada em uma coluna se ela possui uma lista de valores usando js angulares?
index.js
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.data =[{"Id":1,"Title":"en-US","Description":"UnitedStates","MyValues":[{"Id":100,"Value":"Save"}]},
{"Id":1,"Title":"en-UK","Description":"UK","MyValues":[{"Id":102,"Value":"Delete"}]}]
$scope.cols = Object.keys($scope.data[0]);
$scope.notSorted = function(obj){
if (!obj) {
return [];
}
return Object.keys(obj);
}
});
index.html
<table border=1>
<thead>
<tr>
<th ng-repeat="key in notSorted(cols)" ng-init="value=cols[key]">{{value}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in data">
<td ng-if="!$last" ng-repeat="dat in notSorted(row)" ng-init="value=row[dat]">{{value}}</td>
</tr>
</tbody>
</table>
Isso me dá uma tabela perfeita, mas o problema está em uma colunaMyValues
. Eu tenho uma lista de dados e quero criar uma tabela aninhada com todo o valor da lista.
Como posso conseguir isso? Deseja verificar se alguma coluna possui Lista, se sim, gere uma tabela aninhada. verifique este plunkerhttp://plnkr.co/edit/Ixvp8B0dRwOBDHflmu2j?p=preview