How to hide button when checkbox is checked via ng-show and ng-model

Question

need to hide button when any checkboxes is checked.

Here is my code:

need to show button if checkbox is checked and hide button if checkbox is not checked:

<a ng-click="ctrl.editEmployee()" ng-show="showButton" id="btn_edit_employees" class="btn btn-warning" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" hidden>Edit</a>

when I checked next checkboxes:

<table ng-table="ctrl.tableParams" class="table table-striped">
            <tr ng-repeat="row in $data track by row.id">
                <td data-title="">
                    <input type="checkbox" ng-model="showButton">
                </td>
                <td data-title="'Full Name &#8645;'" sortable="'fullname'" data-ng-bind="row.fullname"></td>
            </tr>
</table>

I think hide button not working if I use ng-repeat. Because If I use only one it is working correctly.

Answer 1

I think you should add an click event to handle this. And you need add checked variable inside $data to store if this row is checked and a global showbutton for button's ngIf Like:

<table ng-table="ctrl.tableParams" class="table table-striped">
    <tr ng-repeat="row in $data track by row.id">
        <td data-title="">
            <input type="checkbox" ng-model="row.checked" ng-change="rowCheck()">
        </td>
        <td data-title="'Full Name &#8645;'" sortable="'fullname'" data-ng-bind="row.fullname"></td>
    </tr>
</table>

function rowCheck(){
     $scope.showButton = !$data.every(x=>x.checked);
}