Angularjs. ng-switch does not work inside the table

Question

Can I make ng-switch work inside the table anyway? The sample table does not work, but the ul example works fine. The problem is that I really need an example table. I am using angular 1.07.

<table> <tbody ng-repeat="item in items"> <tr><td>{{ item.heading }}</td></tr> <tr ng-repeat="row in item.fields" ng-switch on="row.nb"> <div ng-switch-when="01"> <td>{{ row.nb }}</td> </div> </tr> </tbody> </table> <ul ng-repeat="item in items"> <li ng-repeat="row in item.fields" ng-switch on="row.nb"> <div ng-switch-when="01"> {{ row.nb }} </div> </li> </ul> 

Answer 1

You need to move ng-switch-when to td, otherwise it will ignore it as invalid because the div not valid markup inside tr . https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tr

Remove the div and change it to:

  <td ng-switch-when="01">{{ row.nb }}</td> 

Demo: http://plnkr.co/edit/yHkBGekjgGDts8pNtekJ?p=preview