簡體   English   中英

角負載數據OnScroll

[英]Angular Load data OnScroll

我只需要一些幫助,我就停滯了,不知道如何在Angular中實現此追加。 我想在用戶滾動且滾動條觸底時添加新數據。 這是我的代碼。

note備注DataModel.getAllData使用分頁參數訪問api。

我堅持在onScroll期間如何添加新元素。 這是我想在滾動上要實現的目的,我想使用list_of_data.html。 將所有新數據放入list_of_data。 得到最終輸出,然后將其附加到data_list上。

指示

app.directive('scroll', function() {
  console.log('scroll directive');
  return function(scope, elm, attr) {
    var raw = elm[0];
    elm.bind('scroll', function() {
      if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight - 20) {
        scope.$apply(attr.scroll);
      }
    });
  };
});

main.html中

 <div class="container" scroll="onScroll()">
    <div id="data_list" data-ng-init="getData()" >
    <div  ng-include src="data_uri"></div>
    </div>
    </div>

list_of_data.html

<div ng-repeat="mydata in list_of_data">
      <div>mydata.name</div>
      <div>mydata.description</div>     
</div>

調節器

  var next;
$scope.onScroll = function()
{ 
  if(next != null || next != "undefined"){
     DataModel.getAllData(user_info,next)
  .then(function (data) {
    $scope.list_of_data = data;
    next = data.next;
  }, function (error) {
    console.log("error"); 
  });
  }
} 

$scope.getData = function(){
  $scope.data_uri= 'views/list/list_of_data.html';
  DataModel.getAllData(user_info)
  .then(function (data) {
    $scope.list_of_data = data;
    next = data.next;
  }, function (error) {
    console.log("error"); 
  });
}

//編輯我嘗試過這樣的事情。 但它只是覆蓋數據

您可以執行以下操作:

$scope.onScroll = function()
{ 
  DataModel.getNextData().then(function(results){
      $scope.list_of_data.push(results);
  });

}

假設您具有特定的API函數以獲取下一個結果。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM