Table 在 AngularJS 中未正确形成
Table is not forming correctly in AngularJS
编辑 1 -
Plnkr 演示问题 - http://plnkr.co/edit/qQn2K3JtSNoPXs9vI7CK?p=preview
---------------- ORIGINAL CODE AND PROBLEM ----------------
我正在使用 angular datatable 生成 table 视图。
我的非常简单的controller代码如下-
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')
];
}
我的查看代码-
<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>
以下是我得到的结果(控制台没有错误)-
如果我从行中删除注释 -
//$scope.dtOptions = DTOptionsBuilder.fromSource(dd);
正在警告以下错误 -
DataTables warning: table id=DataTables_Table_0 - Invalid JSON
response. For more information about this error, please see
http://datatables.net/tn/1
请让我知道我在做什么错了。
这样试试:
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('data', dd);
您还可以使用 DTOptionsBuilder 设置其他选项。您尝试使用 JSON 构建完整的数据表选项,而您只需要设置 "data" 属性。
编辑 1 -
Plnkr 演示问题 - http://plnkr.co/edit/qQn2K3JtSNoPXs9vI7CK?p=preview
---------------- ORIGINAL CODE AND PROBLEM ----------------
我正在使用 angular datatable 生成 table 视图。
我的非常简单的controller代码如下-
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')
];
}
我的查看代码-
<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>
以下是我得到的结果(控制台没有错误)-
如果我从行中删除注释 -
//$scope.dtOptions = DTOptionsBuilder.fromSource(dd);
正在警告以下错误 -
DataTables warning: table id=DataTables_Table_0 - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1
请让我知道我在做什么错了。
这样试试:
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('data', dd);
您还可以使用 DTOptionsBuilder 设置其他选项。您尝试使用 JSON 构建完整的数据表选项,而您只需要设置 "data" 属性。