【问题标题】:Cordova android:Loading data from database with infinite scrolling in onsenuiCordova android:在onsenui中无限滚动从数据库加载数据
【发布时间】:2015-10-31 15:57:55
【问题描述】:

我正在使用 Android 中的 Onsenui 和 Cordova 开发一个混合移动应用程序,我想在主页中显示一些数据并在向下滚动时加载更多项目。 我知道这是使用ons-infinite-scroll 完成的 这是我尝试过的

<ons-scroller
       infinit-scroll-enable="true"  can-load="true" on-scrolled="populateList()" threshold="2" style="height:100%">
<div ng-repeat="item in items">
 //display the data
</div>
</ons-scroller>

Js

module.controller('AppController', function($scope,$http) {
   //for initial loading
   $scope.items=new Array();
   $scope.page=1;
    $http.get(url+"getlotterylist").then(function(msg){
        $scope.loading=false;
        $scope.items=msg.data;
    });
 //load more when scrolls down
     $scope.populateList=function(){


        $http.get(url+"getlotterylist&&page="+$scope.page).then(function(msg){
            $scope.items=msg.data;
             $scope.page +=1;
    });
    }

}

实际问题是向下滚动时用新数据替换旧数据。我该如何解决它?我还想在获取所有数据后停止滚动

php

function get_lottery_list(){
    $limit=7;
    $page=(isset($_GET['page']))?$_GET['page']:1;
    $start=($page-1)*$limit;
    $connect=db_connect();
    $result=$connect->prepare("SELECT * FROM `daily_draw_details` ORDER BY `id` DESC LIMIT $start,$limit");
    $result->execute();
    echo json_encode($result->fetchAll(PDO::FETCH_ASSOC));
  }

【问题讨论】:

    标签: php android cordova onsen-ui


    【解决方案1】:

    每次您发出请求时,您都会用$scope.items=msg.data; 覆盖您的所有项目。只需将新项目附加到 $scope.items 的末尾即可。此外,您可能需要检查ons-lazy-repeat,因为不再支持&lt;ons-scroller infinite-scroll&gt;http://onsen.io/guide/overview.html#UsingLazyRepeat

    【讨论】:

      猜你喜欢
      • 2016-08-16
      • 1970-01-01
      • 1970-01-01
      • 2021-11-13
      • 2016-09-20
      • 2018-07-02
      • 1970-01-01
      • 2021-02-17
      • 2021-02-09
      相关资源
      最近更新 更多