跳過重複用於在某些列NG-重複

Question

我想有一個表這樣使用角重複

HTML

<table border="1"> 
    <tr> 
    <th>Month</th> 
    <th>Savings</th> 
    <th>Savings for holiday!</th> 
    </tr> 
    <tr> 
    <td>January</td> 
    <td>$100</td> 
    <td rowspan="2">$50</td> 
    </tr> 
    <tr> 
    <td>February</td> 
    <td>$80</td> 
    </tr> 

    <tr> 
    <td>January</td> 
    <td>$100</td> 
    <td rowspan="2">$50</td> 
    </tr> 
    <tr> 
    <td>February</td> 
    <td>$80</td> 
    </tr> 
</table> 

我寫了Angularjs碼用於上述如下。

<table border="1"> 
    <tr> 
    <th>Month</th> 
    <th>Savings</th> 
    <th>Savings for holiday!</th> 
    </tr> 
    <tr ng-repeat="row in rows"> 
    <td>{{row.month}}</td> 
    <td>{{row.savings}}</td> 
    <td rowspan="2">{{row.holidaysavings}}</td>  
    </tr> 
</table> 

帶有行長度的td重複使用不需要的ng-repeat。 我該如何避免這種情況？

Answer 1

你試過用ng級嗎？像<td ng-class='{rowSpanClass: row.holidaysavings >== "$50"}

Answer 2

如果你想只有row.holidaysavings設置（你沒有提到它，但它聽起來像它！）最後td元素的東西，你可以使用ngIf。

ngIf是不同之處在於它從DOM，而不是設置display: none刪除它，如果表達的是falsy類似ngShow（例如0或空字符串），這聽起來像你想要什麼：

<td rowspan="2" data-ng-if="row.holidaysavings">{{row.holidaysavings}}</td>