After I select a page number, the localStorage stores this information. However, when I navigate to another page and return back, it always defaults to page 1. This is because the function vm.loadAll is called again after the page is initiated.

(function() {
'use strict';

angular
    .module('eTransportApp')
    .controller('ImprestBillController', ImprestBillController);

ImprestBillController.$inject = ['$state', 'ImprestBill', 'ParseLinks', 'AlertService', '$scope', 'eTransportAppConstants', '$localStorage', 'DateUtils'];

function ImprestBillController($state, ImprestBill, ParseLinks, AlertService, $scope, eTransportAppConstants, $localStorage, DateUtils) {

    var vm = this;

    vm.predicate = 'id';
    vm.reverse = true;
    vm.itemsPerPage = eTransportAppConstants.itemsPerPage;
    vm.page = 1;

    vm.loadAll = function() {

        ImprestBill.query({
            page: vm.page > 0? vm.page - 1: vm.page,
            size: vm.itemsPerPage,
            sort: sort(),
            fromDate: DateUtils.convertLocalDateToServer($localStorage.searchForImprestBill.fromDate),
            toDate: DateUtils.convertLocalDateToServer($localStorage.searchForImprestBill.toDate),
            fromCost: $localStorage.searchForImprestBill.fromCost,
            toCost: $localStorage.searchForImprestBill.toCost,
            status: $localStorage.searchForImprestBill.status,
            clientId: $localStorage.searchForImprestBill.clientId
        }, onSuccess, onError);
        function sort() {
            return [vm.predicate + ',' + (vm.reverse ? 'desc' : 'asc')];
        }
        function onSuccess(data, headers) {
            vm.links = ParseLinks.parse(headers('link'));
            vm.totalItems = headers('X-Total-Count');
            vm.queryCount = vm.totalItems;
            vm.imprestBills = data;
            $localStorage.pageForImprestBill.page = vm.page;
            $localStorage.pageForImprestBill.predicate = vm.predicate;
            $localStorage.pageForImprestBill.reverse = vm.reverse
        }
        function onError(error) {
            AlertService.error(error.data.message);
        }
    }

    vm.clear = function() {
        $localStorage.searchForImprestBill = {};
        $localStorage.pageForImprestBill.page = 1;
        $localStorage.pageForImprestBill.reverse = true;
        $localStorage.pageForImprestBill.predicate = 'id';
        vm.reverse = true;
        vm.predicate = 'id';
        vm.loadAll();
    }

    /*$scope.$on(eTransportAppConstants.EVT_LOAD_RESULT_IMPREST_BILL, function(event){
        vm.loadAll();
    });*/

    function init() {
        if (!$localStorage.searchForImprestBill) {
            $localStorage.searchForImprestBill = {};
        }
        if (!$localStorage.pageForImprestBill) {
            $localStorage.pageForImprestBill = {};
        }
        vm.predicate = $localStorage.pageForImprestBill.predicate? $localStorage.pageForImprestBill.predicate: 'id';
        vm.reverse = $localStorage.pageForImprestBill.reverse? $localStorage.pageForImprestBill.reverse: true;
        vm.page = $localStorage.pageForImprestBill.page? $localStorage.pageForImprestBill.page: 1;
        vm.loadAll();
    }

    vm.showClearBtn = function() {
         return ($localStorage.searchForImprestBill && JSON.stringify($localStorage.searchForImprestBill) !== '{}');
    }

    init();
}

})();

<div>
<h2 data-translate="eTransportApp.imprestBill.home.title">Imprest Bills</h2>
<jhi-alert></jhi-alert>
<div class="container-fluid">
    <div class="row">
        <div class="col-xs-12 no-padding-right no-padding-left">
            <div class="input-group no-padding-left">
                <button class="btn btn-info" ui-sref="imprest-bill.search" >
                    <span class="glyphicon glyphicon-search"></span>
                    <span  data-translate="eTransportApp.imprestBill.home.searchLabel">
                        Search new Imprest Bill
                    </span>
                </button>
                    <button class="btn btn-info " ng-click="vm.clear()" ng-if="vm.showClearBtn()">
                        <span class="glyphicon glyphicon-trash"></span>
                    </button>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12 no-padding-left">
            <button class="btn btn-primary" ui-sref="imprest-bill.new" >
                <span class="glyphicon glyphicon-plus"></span>
                <span  data-translate="eTransportApp.imprestBill.home.createLabel">
                    Create new Imprest Bill
                </span>
            </button>
        </div>
    </div>
</div>
<br/>
<div class="table-responsive">
    <table class="jh-table table table-striped">
        <thead>
            <tr jh-sort="vm.predicate" ascending="vm.reverse" callback="vm.loadAll()">
                <th jh-sort-by="id"><span data-translate="global.field.id">ID</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th jh-sort-by="date"><span data-translate="eTransportApp.imprestBill.date">Date</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th jh-sort-by="totalCost"><span data-translate="eTransportApp.imprestBill.totalCost">Total Cost</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th jh-sort-by="status"><span data-translate="eTransportApp.imprestBill.status">Status</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th jh-sort-by="paidDate"><span data-translate="eTransportApp.imprestBill.paidDate">Paid Date</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th jh-sort-by="note"><span data-translate="eTransportApp.imprestBill.note">Note</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th jh-sort-by="client.name"><span data-translate="eTransportApp.imprestBill.client">Client</span> <span class="glyphicon glyphicon-sort"></span></th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="imprestBill in vm.imprestBills track by imprestBill.id">
                <td><a ui-sref="imprest-bill.edit({id:imprestBill.id})">{{imprestBill.id}}</a></td>
                    <td>{{imprestBill.date | date:'dd/MM/yyyy'}}</td>
                <td>{{imprestBill.totalCost | number}}</td>
                <td data-translate="{{'eTransportApp.ImprestBillStatus.' + imprestBill.status}}">{{imprestBill.status}}</td>
                <td>{{imprestBill.paidDate | date:'dd/MM/yyyy'}}</td>
                <td>{{imprestBill.note}}</td>
                <td>
                    <a ui-sref="client-detail({id:imprestBill.client.id})">{{imprestBill.client.nickName}}</a>
                </td>
                <td class="text-right">
                    <div class="btn-group flex-btn-group-container">
                        <button type="submit"
                                ui-sref="imprest-bill.edit({id:imprestBill.id})"
                                class="btn btn-primary btn-sm">
                            <span class="glyphicon glyphicon-pencil"></span>
                            <span class="hidden-sm-down" data-translate="entity.action.edit"></span>
                        </button>
                        <button type="submit"
                                ui-sref="imprest-bill.delete({id:imprestBill.id})"
                                class="btn btn-danger btn-sm">
                            <span class="glyphicon glyphicon-remove-circle"></span>
                            <span class="hidden-sm-down" data-translate="entity.action.delete"></span>
                        </button>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="text-center">
    <uib-pagination boundary-links="true" 
        class="pagination-sm" 
        total-items="vm.totalItems" 
        ng-model="vm.page"
        items-per-page="vm.itemsPerPage"
        max-size="20" 
        rotate="false" 
        ng-change="vm.loadAll()">
    </uib-pagination>
</div>