multiple checkbox filter in ng-repeat

So i have a search bar that have multiple checkbox that will filter the ng-repeat when i check any of the checkbox they will filter it but when i select another one it doesn't return anything ?

Example Cancelled checkbox and Pending Approval has been checked!

Am i missing something ?

displayedCollection value

displayedCollection:[{ "employeeName" : "test user","employeeName" : "Pending Approval"}]

ng-repeat

<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" ng-model="cancelled" ng-true-value="'Cancelled'" ng-false-value="">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Cancelled</span>

<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" ng-model="pa" ng-true-value="'Pending Approval'" ng-false-value="">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Pending Approval</span>

html

<tr ng-repeat="leave in displayedCollection | dateRanges:from:to | filter:cancelled | filter:pa">
<td class="text-capitalize"></td>
<td> - </td>
<td></td>
<td></td>
<td class="text-center"></td>
<td class="text-center"></td>
<td class="text-center">
    <i class="fa fa-comment-o" aria-hidden="true" data-target="#modalComment" data-toggle="modal" ng-click="vm.getComment(leave)"></i>
</td>
<td class="text-center">
    <button type="button" class="btn btn-trans-blue btn-raised btn-xs btn-circle">
        <strong>
            <i class="fa fa-ellipsis-h fa-1x" aria-hidden="true"></i>
        </strong>
    </button>
    <button type="button" class="btn btn-trans-red btn-raised btn-xs btn-circle" ng-click="vm.deleteLeave(leave)">
        <i class="fa fa-trash-o fa-1x" aria-hidden="true"></i>
    </button>
</td></tr>