confusion in implementing http://jasonwatmore.com/post/2016/01/31/angularjs-pagination-example-with-logic-like-google -
http://jasonwatmore.com/post/2016/01/31/angularjs-pagination-example-with-logic-like-google have show 10 items per page on basis of ajax call. unable reach on condition ng-if="pager.pages.length"
pagination panel not coming on screen. have function name fetchedtrans()
through per ajax call can data server end each pages. have users array(client side)
in array elements transaction array(server side)
. please suggest me appropriate solution this.
app.factory('pagerservice', function () { console.log("in pagerservice"); // service definition var service = {}; service.getpager = getpager; return service; // service implementation function getpager(totalitems, currentpage, pagesize) { // default first page currentpage = currentpage || 1; // default page size 10 pagesize = pagesize || 10; // calculate total pages var totalpages = math.ceil(totalitems / pagesize); var startpage, endpage; if (totalpages <= 10) { // less 10 total pages show startpage = 1; endpage = totalpages; } else { // more 10 total pages calculate start , end pages if (currentpage <= 6) { startpage = 1; endpage = 10; } else if (currentpage + 4 >= totalpages) { startpage = totalpages - 9; endpage = totalpages; } else { startpage = currentpage - 5; endpage = currentpage + 4; } } // calculate start , end item indexes var startindex = (currentpage - 1) * pagesize; var endindex = math.min(startindex + pagesize - 1, totalitems - 1); // create array of pages ng-repeat in pager control.......................... var pages = _.range(startpage, endpage + 1); // return object pager properties required view return { totalitems: totalitems, currentpage: currentpage, pagesize: pagesize, totalpages: totalpages, startpage: startpage, endpage: endpage, startindex: startindex, endindex: endindex, pages: pages }; } }); app.controller('dashctrl',function ($rootscope,$scope,$location,$filter,$stateparams,$state,$cookies,$http,pagerservice) { console.log("$location.search().param1"+$location.search().param1); $scope.check = function () { console.log("in check fn"); var mobilereg = /^(?:(?:\+|0{0,2})91(\s*[\-]\s*)?|[0]?)?[789]\d{9}$/; var digitreg = /^\d+$/; var dashno = { user_name: $cookies.get('user_name'), token: $cookies.get('token'), //mobile_no:$scope.dash.mobile }; if ($location.search().param1 == undefined) { console.log("$scope.dash.mobile"); dashno.mobile_no = $scope.dash.mobile; } else { console.log("in else"); dashno.mobile_no = $location.search().param1;//........ } $scope.mobile_no=dashno.mobile_no; if(mobilereg.test($scope.mobile_no)&&digitreg.test($scope.mobile_no)){ $scope.dashform1hide = true; $http.post('some url', dashno).success(function (data) { if(data.success==1){ $scope.showdetails = true; //$stateparams.param1=dashno.mobile_no; $state.go('add',{param1: $scope.mobile_no}); $scope.email_id = data.email_id; $scope.user_name = data.user_name; $scope.default_vpa = data.default_vpa; $scope.def_vpa_name = data.def_vpa_name; } }) } } if($location.search().param1!=undefined){ console.log("calling check"); $scope.check(); } //dummyitems = _.range(1, 151); // dummy array of items paged //$scope.totalitems; $scope.users=[]; pager = {}; setpage = setpage; //console.log("pagerservice.getpager().currentpage"+pagerservice.getpager().currentpage); initcontroller(); function initcontroller() { fetchedtrans(); } function setpage(page) { console.log("in setpage fn"); console.log("pagerservice.getpager() in setpage: %j",pagerservice.getpager()); //console.log("pager.totalpages"+pager.totalpages); if (page < 1 || page > pager.totalpages) { return; } // pager object service console.log("$scope.users.length"+$scope.users.length); pager = pagerservice.getpager($scope.users.length, page); console.log("pager in setpage fn: %j",pager); //pager.pages.length=$rootscope.pageslength; //pager.pages.length=$scope.users.length; console.log("pager.pages.length"+pager.pages.length); console.log("pager.currentpage in setpage fn"+pager.currentpage); // current page of items $scope.users= $scope.users.slice(pager.startindex, pager.endindex + 1); console.log("$scope.users setpage fn: %j",$scope.users); } function fetchedtrans() { console.log("in fetchtrans"); console.log("pagerservice.getpager(): %j",pagerservice.getpager()); var dashno1 = { mobile_no: $scope.mobile_no, user_name: $cookies.get('user_name'), token: $cookies.get('token'), page: pagerservice.getpager().currentpage-1 }; if (pagerservice.getpager().totalitems == undefined) { dashno1.fetch_tot_trans = 1; } else { dashno1.fetch_tot_trans = 0; } $http.get('/some url',{ params:dashno1 }).success(function (data, status, header, config) { console.log("data: %j",data); if(data.success==1){ console.log("data.total_trans "+data.total_trans); if (pagerservice.getpager().totalitems == undefined) { pagerservice.getpager().totalitems = data.total_trans; console.log("totalitems after getting success"+pagerservice.getpager().totalitems); } if(dashno1.page==0){ $scope.users=data.transactions; } else { var i; (i = dashno1.page * 10; <= (dashno1.page * 10) + 9; i++) { $scope.users[i] = data.transactions[i - (dashno1.page * 10)]; } console.log("$scope.users in fetchtans: %j", $scope.users) } // initialize page 1 setpage(1); } }); } });
Comments
Post a Comment