Angularjs Pull-up loading problem solving method
There is always a problem in the project: When a keyword is entered in the search field (see Figure 1), the first 7 data of the query is returned after the client receives the request, and then the last 7 data is searched for when a pull-up is loaded. But the actual situation is uncertain, in the server console (see Figure 2) can see Begno has been to 126, that is, the client to the server to request 127 times, this is an intolerable result.
Figure 1 Client Search bar
Figure 2 Server Console
It can be concluded that there is a problem with the client's business logic. Return to the client, view the source code logic, modify the following:
Controller
$scope. MedsearchMore = function () {Console.log ("pull-up loaded ..." + isfinished); if (isfinished = = 0) {Begno + = Pcnt;var data = {"Begno": Begno, Start sequence "Pagenum": pagenum,//number of return per page "Searchby": searchby};if (SearchType = = 1) {Data.classid = Searchkey;console.log (data . ClassID); --------1appCallServer ($http, "9002", data, function (data) {Console.log ("drop-down Refresh query result rootscope.med:" + json.stringify ( Data.data)); for (var i = 0; i < data.pcnt; i++) {$rootScope. Med.push (Data.data[i]);} Update Status isfinished = data.isfinished;//the drug has been searched if (isfinished = = ' 1 ') {$scope. NoMore = true;} else{$scope. NoMore = false;} pcnt = data.pcnt;}, function (data) {//medicine completed query $scope.nomore = true; $ionicLoading. Show ({template:data.errtext}); $ Timeout (function () {$ionicLoading. Hide ();}, 1200);});}} else {//medicine has been queried $scope.nomore = true;} $timeout (function () {$scope. $broadcast (' Scroll.infinitescrollcomplete ');};
View
<!--When a user arrives near a footer or footer, the Ion-infinite-scroll directive allows you to invoke a function. When the user scrolls beyond the bottom of the content, it will trigger the on-infinite-->< you specify!--when there is no more data loading, you can use a simple method to prevent infinite scrolling, that is angular ng-if command--><!-- Set the NoMore initial value to True the first click on a categorical query without a drop-down load Operation--><ion-infinite-scroll on-infinite= "Medsearchmore ()" Distance= "0.01%" icon= "Ion-loading-c" ></ion-infinite-scroll><div class= "item" ng-if= "NoMore" align= "center" ><p > No more drugs in the </p></div>
With the above modifications, you can avoid unnecessary requests.
Reference Documents
1.http://www.ionic.wang/js_doc-index-id-29.html
American and American pictures
Angularjs Advanced (38) pull-up loading problem solving method