Browsers react in a bad way when there are unexpected elements, like directives, inside a table.
Versions used below
Replacing table children with Angular directives
I wrote a
restrict: 'E'-style directive intending to do something like this
How it broke
My tr-replacing directive ended up above the table.
This is not an Angular bug. It’s how browsers handle invalid html. Elements other than those allowed to be table children will be moved out. This seems to be a best-effort attempt by the browser to make the html parseable.
You’ll see the same browser behavior with
restrict: 'A' in the directive definition object instead of
The original idea becomes