How to conditionally render an element

[Dan]

Here's my problem.

I want to render a table where the first element is a <TD> that has
rowspan equal to the number of rows in the table. ng:show/hide on
conditionally on the first <TD> with rowspan doesn't do what I want
because even though it hides the <TD> it still causes styling issues
and adds weight to the page.

<table>
<tr>
<th>hdg1</th><th>hdg2</th><th>hdg3</th>
</tr>
<tr ng:repeat="row in rows">
<td rowspan="{{rows.length}}">
{{something}}
</td>
<td>{{row.val1}}</td><td>{{row.val2}}</td>
</tr>
</table>

What I tried unsuccessfully was to use the special $index with
ng:switch but no luck (unless I did something wrong).

<table>
<tr>
<th>hdg1</th><th>hdg2</th><th>hdg3</th>
</tr>
<tr ng:repeat="row in rows">
<ng:switch on="$index">
<td ng:switch-when="0" rowspan="{{rows.length}}">
{{something}}
</td>
</ng:switch>
<td>{{row.val1}}</td><td>{{row.val2}}</td>
</tr>
</table>

I could redesign the layout but for my purposes, the table is the best
fit for this data.

any ideas?

thanks

[Igor Minar]

Hi Dan,

How about this: http://jsfiddle.net/ELHAp/

/i

--
You received this message because you are subscribed to the Google Groups "angular" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.