Angularjs – How to use a local JSON object with angular-datatables


I would like to do this :

testdata = [{"id":"58",...}]; // local object

    "aaData": testdata,
    "aoColumns": [
        { "mDataProp": "id" }
    ] });

with the angular-datatables module. I have tried this :


$scope.dtOptions = DTOptionsBuilder.fromSource('[{"id": 1}]')
$scope.dtColumns = [


<table datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="table table-striped table-bordered"></table>

But it doesn't work at all, and I get this error message :

DataTables warning: table id=DataTables_Table_0 – Ajax error. For more information about this error, please see

Also, I can't use any Ajax options to get json data from an URL, because my angularjs project uses Express and the Rest API, so I get 401 not authorized error while trying to get my data with a GET/POST URL like "/api/data/getJsonData".

Any ideas ? Thanks.

Best Solution

I had a similar problem to the OP and Mica's answer was very helpful in pointing me in the right direction. The solution I used was as follows:

var getTableData = function() {
    var deferred = $q.defer();
    return deferred.promise;

Then use that in the DTOptionsBuilder:

$scope.dtOptions = DTOptionsBuilder.fromFnPromise(getTableData)

I'm fairly new to Angular, and indeed JavaScript, so there may well be a more elegant/correct way of doing this, but it worked for me.

Related Question