current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.5 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 0 down vote favorite

So I have a dropdown..

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

and a table..

<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>

What I wanted to do is to when I select for example number 2 in the dropdown, all other rows in the table will be hidden except the row with ng-bind="d.number" that is equal to 2.

So what I tried so far is this

<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>

But when I select all in the dropdown, the table is empty already.

Is there a cleaner way to do this? Thanks in advance.

share|improve this question
    
maybe have you tried something like: <tr ng-repeat="d in data" ng-if="d.number == dropdown || d.number == 'all'"> – federico scamuzzi 36 mins ago
1  
maybe use filter? something like that <tr ng-repeat="d in data | filter:{number:dropdown}" – Maximus 35 mins ago
up vote 1 down vote

You can use the angular filter to do that like below : 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>
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.