AngulatJS動態數據不能正常工作

Question

HTML

這是我寫的html文件，我與產品形象的細節

<div ng-app='myApp' ng-controller='myController'> 
    <div infinite-scroll='loadMore()' infinite-scroll-distance='2'> 
    <div ng-repeat="user in users"> 
     <div class="col-md-3"> 
     <div class="panel panel-default text-center"> 
      <img src="../backend/uploads/{{user.image}}" width="200px" height="300px"> 
      <p>{{user.name}}</p> 
      <span><strong>&#8377;{{user.price}}</strong></span> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

重複列3 JS 我從PHP文件數據，但它變成無限循環

var myApp = angular.module('myApp', ['infinite-scroll']); 
myApp.controller('myController', function($scope, $http) { 

//get data from php file 

    $http({ 
    method: 'get', 
    url: 'fetch_scroll.php' 
    }).then(function successCallback(response) { 
     $scope.users = response.data; 
     console.log($scope.users); 
    }); 
    //function to load products 

    $scope.loadMore = function() { 
    var length = $scope.users.length; 
    var last = $scope.users[length - 1]; 
    for(var i = 1; i <= length; i++) { 
     $scope.users.push(last + i); 
    } 
    }; 
}); 

Answer 1

我想你的$scope.loadMore功能被稱爲之前successCallback功能。

您可以在從服務器獲取數據後調用該函數。下面的代碼片段可能會有所幫助：

var myApp = angular.module('myApp', ['infinite-scroll']); 
myApp.controller('myController', function($scope, $http) { 

//get data from php file 

    $http({ 
    method: 'get', 
    url: 'fetch_scroll.php' 
    }).then(function successCallback(response) { 
     $scope.users = response.data; 
     console.log($scope.users); 

     // Added this inside the successCallback 
     $scope.loadMore(); 
    }); 
    //function to load products 

    $scope.loadMore = function() { 
    var length = $scope.users.length; 
    var last = $scope.users[length - 1]; 
    for(var i = 1; i <= length; i++) { 
     $scope.users.push(last + i); 
    } 
    }; 
});