如何根据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"等于{{1 }}

所以我到目前为止尝试的是

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> 时，表格已经为空。

有更清洁的方法吗？提前谢谢。

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>