javascript - Bind dynamic columns to a table using angularJS -

javascript - Bind dynamic columns to a table using angularJS -

i getting info external service , trying show on table. problem info service dynamic columns, times there 5 column time 8. don't know how handle in ng-repeat. , using things ng-grid won't solution think there 10 rows display. if utilize external solution overhead. there angular method accomplish this? if not best alternative little data.

note: column names dynamic code

<div ng-app='myapp' ng-controller="mainctrl"> <div ng-repeat="prdelement in packageelement track $index" class="package-grid"> <table class="hovertable"> <thead> <tr> <th>line #</th> <th>quantity in plt</th> <th>allready packed</th> </tr> </thead> <tbody> <tr ng-repeat="data in prdelement.data" ng-init="data.newquantity = 0"> <td>{{data.itemid}}</td> <td> {{data.quantity}} </td> <td>{{data.packed}}</td> </tr> </tbody> </table> </div>

angular.module('myapp', []).controller('mainctrl', function ($scope) { var counter = 0; $scope.packageelement = [{ name: counter, show: true, data: [{ name: 'item 1', itemid: '284307', quantity: '100', packed: 0 }, { name: 'item 2', itemid: '284308', quantity: '200', packed: 0 }] }]; });

will there same number of columns info items? if so, think can this.

1. define function on scope gives object keys: $scope.keys = function(obj) { var key; var keys = []; (key in obj) { if (key === "$$hashkey") break; //angular adds new keys object if (obj.hasownproperty(key)) keys.push(key); } homecoming keys; } 2. utilize repeater on table header (if objects can have different properties, need find object highest number of properties/columns) <th ng-repeat="key in keys( prdelement.data[0] )">{{key}}</th> 3. utilize repeater on table cell <td ng-repeat="key in keys( prdelement.data[0] )">{{ data[key] }}</td>

javascript angularjs