#javascript #arrays #angularjs #datatables #angular-datatables
#javascript #массивы #angularjs #таблицы данных #angular-datatables
Вопрос:
Я хочу загрузить таблицу angular-datatable с массивом javascript, но если я попробую это сделать, я получу эту ошибку
DataTables warning: table id=DataTables_Table_0 - Ajax error. For more information about this error, please see http://datatables.net/tn/7
похоже, он пытается получить доступ к какому-то URL
Я хочу загрузить ее с моего контроллера angularjs, вот мой html-код
<div class="table-responsive">
<table datatable=""
dt-options="ctrl.dtOptions"
dt-columns="ctrl.dtColumns"
class="table table-striped table-bordered table-hover"
width="100%">
</table>
</div>
и вот код внутри моего контроллера angularjs:
var data = [{
"name": the name,
"lastname": "xx",
"age": 2
}, {
"name": the name two,
"lastname": "yy",
"age": 3
}];
vm.dtOptions = DTOptionsBuilder.fromSource(JSON.stringify(data))
.withOption('createdRow', createdRow)
.withOption('stateSave', true)
.withPaginationType('full_numbers')
// Add Bootstrap compatibility
.withBootstrap()
// Active Responsive plugin
.withOption('responsive', true);
vm.dtColumns = [
DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable()
.renderWith(actionsHtmlEstatus),
DTColumnBuilder.newColumn('name').withTitle('Name'),
DTColumnBuilder.newColumn('lastname').withTitle('lastname'),
DTColumnBuilder.newColumn('age').withTitle('age')
];
Ответ №1:
Если у вас есть статический литерал JSON / object, просто используйте data
опцию :
vm.dtOptions = $scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('data', data) // <---- like this
.withOption('createdRow', createdRow)
.withOption('stateSave', true)
...
демонстрация с использованием образца массива в OP ->
http://plnkr.co/edit/s2RybDQ8WV27jPOf4VQA?p=preview
Ответ №2:
Вы не можете использовать .fromSource
, поскольку он всегда будет выполнять запрос ajaxUrl. вместо этого вы можете использовать .fromFnPromise()
. Вам нужно поместить свой JSON в функцию, которая возвращает deferred.promise.
проверьте ниже pen для рабочего примера:
http://codepen.io/anon/pen/jrLpZX