6

我正在使用数据表:https ://l-lin.github.io/angular-datatables 和引导程序:https ://angular-ui.github.io/bootstrap/

这是我试图达到的目标:使用引导程序中的模式添加数据并保存后,重新加载数据表(不重新加载当前路由)。

这是我的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);
        })
    };
}])

这是我的数据表功能:

 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();
}

}

如何调用 reloadData() 函数以便刷新数据表。我试图注入 AdminenuTableData 函数,但没有运气。喷油器发生故障。

有什么建议吗?

4

1 回答 1

13

改为使用rerender()。它会破坏表重新初始化它,包括重新加载 AJAX 源:

$scope.reloadData = function() {
   $scope.dtInstance.rerender(); 
}

演示-> http://plnkr.co/edit/HbMDcMne3OiH2KYbJ8Iv?p=preview

于 2015-12-21T12:08:11.417 回答