如何根據AngularJS中的選項值隱藏表格行？

Question

所以我有一個下拉..

<select ng-model="dropdown"> 
    <option ng-value="1">1</option> 
    <option ng-value="2">2</option> 
    <option ng-value="all">All</option> 
</select> 

和一張桌子..

<table> 
    <tr ng-repeat="d in data"> 
     <td ng-bind="d.number"></td> // 0 or 1 
     <td>Other TD's</td> 
     <td>Other TD's</td> 
    </tr> 
</table> 

我想要做的是，當我在下拉列表中選擇，例如數2，所有其他行中該表將被隱藏，但ng-bind="d.number"等於2的行除外。

所以我試圖到目前爲止，這是

<table> 
    <tr ng-repeat="d in data" ng-if="d.number == dropdown"> 
     <td ng-bind="d.number"></td> // 0 or 1 
     <td>Other TD's</td> 
     <td>Other TD's</td> 
    </tr> 
</table> 

但是，當我在下拉列表中選擇all，表是空的了。

有沒有更乾淨的方法來做到這一點？提前致謝。

Answer 1

可以使用角度filter做象下面這樣： Plunkr

<table> 
<tr ng-repeat="d in data | filter: {number: dropdown||undefined}"> 
<td ng-bind="d.number"></td> // 0 or 1 
<td>Other TD's</td> 
<td>Other TD's</td> 
</tr> 
</table>