The problem is that tablesorter plugin does not play properly with dynamic columns. In other words, even if you remove all Angular code and try creating new columns for a table and refreshing trablesorter, it will not work.
In that case, you want to look for a alternative plugin, or maybe a Angular only solution (take a look at the examples).
As a second point, you never touch the DOM from inside a controller:
Do not use controllers to:
- Manipulate DOM — Controllers should contain only business logic.
Putting any presentation logic into Controllers significantly affects
its testability. Angular has databinding for most cases and directives
to encapsulate manual DOM manipulation.
Use a directive for that purpose.
EDIT:
As per @Mottie's answer, you can trigger a updateAll
event on the table, but you need to wait for Angular digest to run and update the DOM, so you need the setTimeout
.
You should still move all the logic that touches the DOM to a directive.