How do I include bootstrap UI components in table

Currently the table widget only allow me to specify the filter for each data column in "Column Keys",

e.g. name | myfilter.

I need to be able to include a progressbar (ui.bootstrap.progressbar) but it's seems to be impossible to insert a directive within a filter.

Note that I even had to modify the following line in pbTable.json:
{{ $eval(column, row) | uiTranslate }}
to:
<span ng-bind-html=\"$eval(column, row) | uiTranslate\"></span>

... in order to get any html inserted from the filter to work at all.

Is there a better way to go about this whole thing?