如何使用angularJS在同一頁面添加條目，而不使用數組來存儲以前的條目

Question

這是我的html文件，它從控制器獲取數據。控制器每次從API獲取新數據一次通過增加偏移值按下加載按鈕。

<div class="container" ng-app="myApp" ng-controller="myctrl"> 
    <div class="row row-gap" ng-repeat="data in data"> 
     <div class="media-left media-middle"> 
      <a href="#"> 
      <img class="media-object rounded" ng-src="{{data.thumbnail}}"> 
      </a> 
     </div> 
     <div class="media-body" > 
      <table class="table table-striped"> 
      <tr> 
       <td class="col-md-3"> <span class="glyphicon glyphicon-share-alt" aria-hidden="true">Name</span></td> 
       <td class="col-md-9">{{data.title}}</td> 
      </tr> 
      <tr> 
       <td class="col-md-3"> <span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span> Place </td> 
       <td class="col-md-9"> Star{{data.placeName}} </td> 
       </tr> 
       <tr> 
        <td class="col-md-3"> <span class="glyphicon glyphicon-time" aria-hidden="true"></span> Submitted On </td> 
       <td class="col-md-9">{{data.createdOn |date }}</td> 
       </tr> 
      </table> 
      <img ng-src="{{data.author.icon}}";alt="{{data.author.name}}";height=30px; width=30px > 
     </div> 
     </div> 

     <button type="button" ng-click="loadMore(count=count+1)" class="btn btn-default">load More</button> 

    </div> 

容器代碼如下。我知道我正在使用相同的數據變量來存儲後續的查詢結果。 我只是希望每當我點擊加載更多按鈕時，數據會附加到同一頁面而不影響以前的值。

var myApp=angular.module('myApp',[]); 

myApp.controller('myctrl',function ($scope, $http) { 

    $http({ 
     method: 'GET', 
     url: 'API?max=10&offset=0&format=json' 

    }).then(function (datacontent){ 
     $scope.data=datacontent.data.model.observationInstanceList; 
     console.log(show); 
    },function (error){ 
//console.log(error); 
    }); 

$scope.count=0; 
$scope.loadMore=function(value) { 
value=value*10; 
    $http({ 
     method: 'GET', 
     url: 'http://API?max=10&offset='+value+'&format=json' 

    }).then(function (dataco){ 
     $scope.data=dataco.data.model.observationInstanceList; 

    },function (error){ 
//console.log(error); 
    }); 
} 

}); 

    I need answer in such a way, the array size doesnot increase much. 

Answer 1

試試這個，但只適用於dataco.data.model.observationInstanceList是數組。

$scope.data = $scope.data.length ? $scope.data.concat(dataco.data.model.observationInstanceList) : dataco.data.model.observationInstanceList; 

更改您的代碼如下

$scope.count=0; 
$scope.loadMore=function(value) { 
value=value*10; 
    $http({ 
     method: 'GET', 
     url: 'http://API?max=10&offset='+value+'&format=json' 

    }).then(function (dataco){ 
     $scope.data = $scope.data.length ? $scope.data.concat(dataco.data.model.observationInstanceList) : dataco.data.model.observationInstanceList; 

    },function (error){ 
//console.log(error); 
    }); 
}