Angular-datatables将列添加到通过promise加载的表中

时间:2015-04-21 04:47:07

标签: angularjs datatables angular-promise

已经尝试过:

a previous question中关于承诺函数的问题类似的问题。仔细检查了所有这些后,我仍然无法理解如何解决以下问题:

问题:

我正在尝试将用户指定的数据加载到angular-datatable表。用户可以选择他们想要查看的字段。我能找到的最好方法是通过promise加载列数据。

但是我还想添加一个操作列来删除和编辑数据行,所以我试图将此列数据推送到设置数组。这当然不起作用,因为它是一个promise对象而不是实际的数组。

我不知道如何安排这些功能以这种方式添加最后一列(我是一个合理的新开发人员)。以下是控制器代码的摘录:

function angularDataTable(DTOptionsBuilder, DTColumnBuilder, $q, $resource) {
    var vm = this;
    vm.dtOptions = DTOptionsBuilder.fromSource('resources/customerData.json')
            .withPaginationType('full_numbers');
    vm.dtColumns = $resource('resources/fieldSelection.json').query().$promise;
    //So I know this is the incorrect way to work with promise objects but I don't know how to rearrange it to work.
    vm.dtColumns.push(DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable().renderWith(actionsHtml));
    vm.edit = edit;
    vm.delRow = deleteRow;

    function actionsHtml(data, type, full, meta) {
        return '<button class="btn btn-warning" ng-click="table.edit(' + data.id + ')">' +
            '   <i class="fa fa-edit"></i>' +
            '</button>&nbsp;' +
            '<button class="btn btn-danger" ng-click="table.delRow(' + data.id + ')">' +
            '   <i class="fa fa-trash-o"></i>' +
            '</button>';
    }

    function edit(id) {
        console.log('edit');
    }
    function deleteRow(id) {
        console.log(id);
    }
}

Full code on github

1 个答案:

答案 0 :(得分:1)

查看tabletools部分http://l-lin.github.io/angular-datatables/#/withTableTools

此外,如果您在控制器中定义列,则可以使用notVisibile()visible()隐藏和显示列。有关示例,请参阅http://l-lin.github.io/angular-datatables/#/rerender