我有一个可以通过本地条件修改的json对象(不是async ajax调用)。我希望这个json对象在datatables网格上输出。
我有显示数据的表格,但是如果数据发生变化,则网格不会。我每次都必须调用构造函数数据表吗?我宁愿只使用双向绑定,但我不确定。我已经使用$ watch更新了它,但如果可以的话,我想避免在这个大对象上使用$ watch。它可能有1000行。
这是显示数据表负载的fiddle,以及在3000毫秒(简单$ timeout)后更改时运行的数据。有没有办法让表检测json对象的变化并刷新自己?或者我需要在Angular代码中做一些不同的事情吗?
我正在使用指令加载表:
.directive('myTable', function() {
return {
restrict: 'E',
scope: {
data: '=',
options: '=',
columns: '='
},
template:
'<table id="balancesTable"></table>',
replace: true,
link: function(scope, elem, attrs) {
scope.options["aaData"] = scope.data;
scope.options["aoColumnDefs"] = scope.columns;
elem.dataTable(scope.options);
}
};
})
我的控制器(为简洁而编辑...请参阅完整代码的小提琴):
var myApp = angular.module('myApp', [])
.controller('MyAppCtrl', function ($scope, $timeout) {
$("#data-preview").css("color","green");
$scope.dataObj = [ { "balanceType": "Available Funds", ... } ];
$timeout(function(){
$scope.dataObj = [ { "balanceType": "Available Funds", ... different data ...} ];
$("#data-preview").css("color","red");
},
3000);
// columns settings for data table
$scope.columnDefs = [
{
"mData": "balanceType",
"sTitle": "Balance Type",
"aTargets":[0],
"sWidth": "200px"
},
{
...
}
];
// data table settings for table to not show search, pagination and allow column resize
$scope.overrideOptions = {
"bSort": true,
"bPaginate": false,
"sDom": "Rlfrtip",
"bFilter": false,
"bAutoWidth": false,
"bInfo": false
};
})
HTML:
<pre id="data-preview">{{dataObj}} | json}}</pre>
<my-table options="overrideOptions" data="dataObj" columns="columnDefs"><my-table>
先谢谢!!