how to hide\show list items from button in angular js

Question

i have list of items and i want to create filter from button that shows\hides the element, instead of add\remove it from the DOM.

<li ng-repeat="li in list" ng-show="">
<a ng-click="">category</a>
</li>

i mean that instead of filtering list i want to hide\show list items by this filter. i found this fiddle http://jsfiddle.net/cKa6K/

but i want to do the same only with hide\show.

need more detail, what exactly is supposed to happen, where is the filter coming from? — user9903
– user9903, Commented Sep 11, 2013 at 15:15

DotDotDot · Accepted Answer · 2013-09-11 15:25:00Z

4

Without more information on your code, I'd do something like that : http://jsfiddle.net/DotDotDot/tpmxN/1/
I used an item list with 2 properties, the name and a category
I defined a function for the ng-show, which will compare the item category to the filter

 <li ng-repeat="li in list" ng-show="isDisplayed(li, filter)">

Then in the controller the function is defined by :

 $scope.isDisplayed=function(item, filter){
 if(filter!="")
 {
     if(item.category==filter)
         return true;
     return false;
 }
    return true;
}

Nothing really hard in this, then you just have to set the filter property, I used buttons with ng-click and the category in the ng-repeat, you can click on them, it will hide/show the proper items

I hope this helps

Have fun

answered Sep 11, 2013 at 15:25

DotDotDot

3,5662 gold badges22 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to hide\show list items from button in angular js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related