Question

当我向下滚动网站页面时，我试图获得一个可以添加新条目的表格。但是，虽然我已经显示了我的初始列表，但它们不会更新。当我向下滚动时，如何更新列表？代码如下：

查看：

 <table border = "3" ng-init="users()" >
    <div infinite-scroll='loadMore()' infinite-scroll-distance='3'>
        <tr ng-repeat = "y in images track by $index">
            <td>{{y.username}}</td>
            <td>{{y.appId}}</td>
            <td>{{y.aaid}}</td>
        </tr>
    </div>

</table>

控制器：

var userurl = '';
    var images = [];
    var returnUsers = [];


    $scope.users = function(){

        userurl = 'http://localhost:8085/rest/uafapp/userlisttest';
        var userdata = [];
        var userconfig =
        {
            headers: {
                'Content-Type':'application/json'
            }
        };
        var userPostRequest = $.get(userurl, userdata, userconfig);
        var userjson = '{\"USER_DATA_RETRIEVED\" : \"fail\"}';
        userPostRequest.done(function(userdata){

            userjson = JSON.stringify(userdata);
            userjson = userjson.replace(/\\"/g, '"');
            userjson = userjson.replace(/\"{/g, '{');
            userjson = userjson.replace(/}\"/g, '}');

            //console.log("userjson :: " + userjson);
            var postResponse = jQuery.parseJSON(userjson);
            returnUsers = postResponse['users'];
            $scope.returnUsers = returnUsers;
            //console.log(JSON.stringify($scope.returnUsers));
            $scope.$apply()

        })
        $.when(userPostRequest).done(function(){
            images = [returnUsers[Object.keys(returnUsers)[0]],
                returnUsers[Object.keys(returnUsers)[1]],
                returnUsers[Object.keys(returnUsers)[2]],
                returnUsers[Object.keys(returnUsers)[3]] ];

            //console.log(JSON.stringify($scope.returnUsers[Object.keys($scope.returnUsers)[0]]));
            //console.log(JSON.stringify($scope.returnUsers[Object.keys($scope.returnUsers)[1]]));
            //console.log(JSON.stringify($scope.returnUsers[Object.keys($scope.returnUsers)[2]]));
            //console.log(JSON.stringify($scope.returnUsers[Object.keys($scope.returnUsers)[3]]));

            $scope.images = images;

            var last = images.length;
            console.log("------- loop and index: " +  last);

            $scope.$apply()
        });

    };

    $scope.loadMore = function() {
        console.log("first thing inside the loadMore method");
        var last = images.length - 1;
        console.log("before the loop and index: " +  last);
        for(var i = 1; i <= 5; i++) {
            console.log("inside the loop " + i);
            images.push(returnUsers[Object.keys(returnUsers)[last + i]]);
        }
        $scope.images = images;
        $scope.$apply();
    };

Answer 1

您正在覆盖$scope.images数组，而不是append。当然，您必须使用concat方法将旧项目附加新项目。

然后，在loadMore()功能中，只需更改此内容：

$scope.images = images;

有：

$scope.images = $scope.images.concat(images);

我希望它有所帮助!!

AngularJS NgInfiniteScroll显示初始列表，但不会更新

1 个答案: