javascript - How to show and hide rows using several select buttons -

i have problem showing , hiding rows, when select 2 select buttons @ once.

using 1 button, can show/hide correct rows. using both buttons @ once, no rows displayed.

where logical error in code?

please check: http://jsfiddle.net/xeyjz/83/

<div ng-controller="myctrl">   <p>   <input type="checkbox" ng-init="shownew=false" ng-click="shownew =! shownew"><span> show new only</span> <br>    <input type="checkbox" ng-init="showold=false" ng-click="showold =! showold"><span> show old </span>      </p>      <table border="1">         <tr ng-repeat="person in persons" ng-class="{'newp':person.newp, 'oldp':person.oldp}"              ng-hide="(!person.newp && shownew) || (!person.oldp && showold)">              <td>{{ person.id }}</td>             <td>{{ person.name }}</td>             <td>{{ person.city }}</td>         </tr>     </table>   </div> 

you can use comparator in filter:

ng-repeat="person in persons | filter:{newp:shownew, oldp:showold}:showtest"

and in controller set comparison function:

$scope.showtest = function(actual, expected){         if(!$scope.shownew && !$scope.showold)             return true;         return angular.equals(expected, actual); } 

http://jsfiddle.net/d79f7/2/