Using ng-if with multiple table rows in angular

Question

Right now I have the following html:

<body ng-controller="defaultCtrl">
<table>
<thead>
  <tr>
    <th>Default</th>
    <th ng-if="c">A</th>
    <th ng-if="c">B</th>
    <th ng-if="c">C</th>
    <th ng-if="c">D</th>
  </tr>
</thead>
</table>
</body>

If $scope.c exists in my defaultCtrl, I want A, B, C, D to appear as table headers.

How can I group ng-if instead of repeating it 4 times?

When I try to put the four elements in a div or span, I'm getting an error message saying that I'm invoking voodoo mode.

Do you really get an error that says voodoo mode? :) you might include the error message in your question... — Sunil D.
– Sunil D., Commented Sep 20, 2014 at 21:31
You cannot group th's inside a span or div, which is invalid html. It must appear only within tr.. — PSL
– PSL, Commented Sep 20, 2014 at 21:37

zs2020 · Accepted Answer · 2014-09-21 02:23:09Z

2

Well, you can definitely do it like this

<th ng-if="c" ng-repeat="x in ['A', 'B', 'C', 'D']">{{x}}</th>

answered Sep 21, 2014 at 2:23

zs2020

54.7k30 gold badges157 silver badges223 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using ng-if with multiple table rows in angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related