如何根据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>