How To Create CheckedAll Function Based On AngularJS Model

In this case I want to create select all method using angular model. I have list of object and show it on my jsp on table. Here is snap of my jsp code.

<div ng-controller="historyController">
	<div style="margin-bottom: 10px;vertical-align: middle">
		<input ng-click="selectAllAct()" type="checkbox" /> &nbsp;Select All Transactions
	</div>
	<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" id="exampleone">
		<thead>
			<tr>
				<th width="10%">Transaction Time</th>
				<th width="10%">Debit</th>
				<th width="10%">Credit</th>
				<th width="10%">Description</th>
				<th width="5%">Action</th>
			</tr>
		</thead>
		<tbody>
			<tr ng-repeat="trx in $parent.trxListFilter = (hisTrxList|filter:trxFilter) | startFrom:$parent.currentPage * $parent.dataPerPage | limitTo:$parent.dataPerPage | orderBy: trxTime" repeat-done="numberOfPages()">
				<td width="10%">{{trx.trxTime| date: "dd MMMM yyyy HH:mm:ss"}}</td>
				<td width="10%">{{trx.dbAmount| currency:"Rp "}}</td>
				<td width="10%">{{trx.crAmount| currency:"Rp "}}</td>
				<td width="10%">{{trx.txDesc}}</td>
				<td width="5%"><input type="checkbox" class="checkbox" ng-model="trx.isProcess" ng-true-value="T" ng-false-value="F"/></td>
			</tr>
		</tbody>
	</table>
</div>

Here is my javascript code.

showApp.controller('historyController', ['$scope', '$http', 'localStorageService', function($scope, $http, localStorageService) {
        $scope.hisTrxList = null;
        $scope.selectAll = false;

        $scope.getHistoryList = function() {
            //some method to get list of history trx
        };

        $scope.selectAllAct = function() {
            $scope.selectAll = !$scope.selectAll;
            console.log($scope.selectAll);
            if ($scope.hisTrxList != null && $scope.hisTrxList.length > 0) {                
                angular.forEach($scope.hisTrxList, function(trx, Key) {
                    trx.isProcess = $scope.selectAll?"T":"F";  
                });
            }
        };
        
        $scope.getHistoryList();

    }]);

Hope this simple article can help 🙂