renderWith could handle returned DOM elements also

[ilovett]

I'd like to provide a compiled DOM element

colDef.renderWith(function(cell, type, row) {

  var renderScope = scope.$new(true, scope.$parent);

  renderScope.cell = cell;
  renderScope.row = row;
  renderScope.getScope = scope.$parent;

  // returns angular compiled html with expression
  return $compile('<button ng-click="getScope.myThing(row)">{{ row }}</button>')(renderScope);

});

However the output in my table cell is [object Object] (the DOM object). The renderWith listener could check to see if the returned value is a string or a DOM element, and if it's a DOM element to just append that.

May run in to issues with trusting html, in which case $sce.trustAsHtml() and ng-bind-html would need to be implemented into the solution.

[l-lin]

Except that all renderWith is doing is setting the value of columns.render. The render function is expecting a string and angular-datatables cannot really change the DataTables behavior.

I don't really know if it's really possible to use the DOM element instead of a string.

[ilovett]

Yes, you're right. There are a few issues open such as https://github.com/DataTables/DataTables/issues/435

It looks like the author is interested in the idea but is going to eventually implement his own solution.

[rubenspgcavalcante]

Having the same problem! Up! 👍

[l-lin]

Closing as issue is too old and the version is no longer maintained.