Javascript Angular 存储数据和重新加载数据表
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/32961172/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular Store Data and Reload Datatable
提问by ssuhat
I'm using datatable: https://l-lin.github.io/angular-datatablesand bootstrap: https://angular-ui.github.io/bootstrap/
我正在使用数据表:https: //l-lin.github.io/angular-datatables和引导程序:https: //angular-ui.github.io/bootstrap/
this what i try to achive: after add data using modal from bootstrap and save it, the datatable is reload (without reload current route).
这就是我尝试实现的目标:使用引导程序中的模态添加数据并保存后,重新加载数据表(不重新加载当前路由)。
Here is my modalCtrl:
这是我的 modalCtrl:
.controller('addModalCtrl', ['$scope', '$modalInstance', '$http', 'AdminMenu', 'ResultService',
function ($scope, $modalInstance, $http, AdminMenu, ResultService) {
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
$scope.menu = {};
$scope.doSubmit = function () {
var data = {
name: $scope.menu.title,
icon: $scope.menu.icon
};
AdminMenu.save(data, function (response) {
$scope.menu = {};
ResultService(response);
$modalInstance.dismiss('cancel');
}, function (response) {
ResultService(response.data);
})
};
}])
here is my datatable function:
这是我的数据表函数:
function AdminMenuTableData($compile, $scope, $modal, DTOptionsBuilder, DTColumnBuilder, SweetAlert, AdminMenu, ResultService, APIROOT) {
$scope.dtOptions = DTOptionsBuilder.fromSource(APIROOT + 'admin-menus')
.withOption('order', [0, "asc"])
.withOption('createdRow', function (row, data, dataIndex) {
// Recompiling so we can bind Angular directive to the DT
$compile(angular.element(row).contents())($scope);
});
$scope.dtColumns = [
DTColumnBuilder.newColumn('id', 'ID').withOption('searchable', false),
DTColumnBuilder.newColumn('name', 'Name'),
DTColumnBuilder.newColumn('', 'Actions').renderWith(function (data, type, full, meta) {
return '<a class="btn btn-default btn-xs" ng-click=edit(' + full.id + ')><i class="fa fa-pencil"></i></a> ' +
'<a class="btn btn-danger btn-xs" ng-click=delete(' + full.id + ')><i class="fa fa-trash"></i></a>';
}).notSortable()
];
$scope.dtInstance = {};
function reloadData()
{
$scope.dtInstance.reloadData();
}
}
}
How can i call reloadData() function so i can refresh the datatable. I've tried to inject AdminenuTableData function but no luck. injector failed.
我如何调用 reloadData() 函数以便刷新数据表。我尝试注入 AdminenuTableData 函数,但没有成功。喷油器故障。
Any suggestion?
有什么建议吗?
回答by davidkonrad
Use rerender()
instead. It both destroys the table andreinitialize it, including reloading AJAX sources :
使用rerender()
来代替。它既销毁表又重新初始化它,包括重新加载 AJAX 源:
$scope.reloadData = function() {
$scope.dtInstance.rerender();
}