使用行对象数据和html创建列

时间:2017-10-24 15:15:50

标签: javascript angularjs datatables angular-datatables

我必须在我的表中创建一个自定义列,允许我执行操作,并根据定义行的对象生成哪些HTML代码。

我是棱角分明的新手,我想我应该使用$ compile但是我不确定如何。

列定义:

vm.dtColumns = [
  DTColumnBuilder.newColumn('name').withTitle("Name"),
  DTColumnBuilder.newColumn(null).withTitle("Actions").notSortable()
  .renderWith(function(data, type, full, meta) {
    //imported code from a previous version where the code was generated from a ng-repeat directive
    //project is the object, which can be found in the full parameter of the function
     var html = '<button data-toggle="modal" data-target="#archiveProjectModal" type="button" class="btn btn-success col-sm-10 col-sm-offset-1" ng-if="project.active"><i class="fa fa-check">&nbsp;&nbsp;</i>Archiver</button>'
     + '<a href="/project/{{project.id}}" type="button" class="btn btn-primary col-sm-10 col-sm-offset-1"><i class="fa fa-pencil">&nbsp;&nbsp;</i>Mettre à jour</a>'
     + '<button data-toggle="modal" data-target="#deleteProjectModal" type="button" class="btn btn-danger col-xs-10 col-xs-offset-1"><i class="fa fa-trash">&nbsp;&nbsp;</i>Supprimer</button>'
     //what should i return ?
      return "?";
  }),
];

有人可以帮助我吗?

1 个答案:

答案 0 :(得分:0)

你应该返回html字符串

return html

如果返回的html包含应该调用的指令,例如$compile等,则只需要ng-click。在initComplete回调中执行此操作:

vm.dtOptions = DTOptionsBuilder.newOptions()
  .withOption('initComplete', function() {
     $compile(angular.element('#tableId'))($scope);
   })
})