javascript - Table is not forming correctly in AngularJS -

edit 1 -

plnkr demonstrate problem - http://plnkr.co/edit/qqn2k3jtsnopxs9vi7ck?p=preview

---------------- original code , problem ----------------

i using angular datatable generate table view.

my simple controller code follows -

function tabletestctrl ($scope, dtoptionsbuilder, dtcolumnbuilder, localstorageservice) {     console.log('from table');     var tbdata = localstorageservice.get('tabledata') || {};     var dd = new array();     dd = [{"name": "tiger nixon", "age": "61"},{"name": "garrett winters","age": "63"}];        //$scope.dtoptions = dtoptionsbuilder.fromsource(dd);     $scope.dtoptions = dd;     console.log($scope.dtoptions);                 $scope.dtcolumns = [                 dtcolumnbuilder.newcolumn('name').withtitle('name'),                 dtcolumnbuilder.newcolumn('age').withtitle('age')             ]; } 

my view code -

<div class="panel-body" ng-controller="tabletestctrl">     <div class="table-responsive" ng-if="dtoptions">         <table datatable="" dt-options="dtoptions" dt-columns="dtcolumns" class="table table-striped table-bordered table-hover"></table>     </div> </div> 

following result getting(no error in console) -

if remove comment line -

//$scope.dtoptions = dtoptionsbuilder.fromsource(dd); 

it alerting following error -

datatables warning: table id=datatables_table_0 - invalid json response. more information error, please see http://datatables.net/tn/1

please let me know doing wrong here.

try way:

$scope.dtoptions = dtoptionsbuilder.newoptions() .withoption('data', dd); 

you can set other options using dtoptionsbuilder. tried built complete datatables options using json, while ment set "data" attribute.

plunkr