Question

我正在尝试创建一个在angularjs中无限滚动的列表。为此，我需要从api中获取新数据，然后将其附加到angularjs中范围的现有结果中。我尝试了几种方法，但到目前为止还没有一种方法目前这是我的控制器：

userControllers.controller('userListCtrl', ['$scope', 'User',
    function($scope, User) {
        $scope.users = User.query();
        $scope.$watch('users');
        $scope.orderProp = 'name';
        window.addEventListener('scroll', function(event) {
            if (document.body.offsetHeight < window.scrollY +
                    document.documentElement.clientHeight + 300) {
                var promise = user.query();
                $scope.users = $scope.users.concat(promise);
            }
        }, false);
    }
]);

这是我的服务：

userServices.factory('User', ['$resource',
    function($resource) {
        return $resource('api/users', {}, {
            query: {
                method: 'GET',
                isArray: true
            }
        });
    }
]);

如何将新结果附加到范围而不是替换旧结果？

Answer 1

我认为您可能需要使用$ scope.apply（）当承诺返回时，因为它不是角度执行循环的一部分。尝试类似的东西： User.query（）。然后（函数（）{ $ scope.apply（函数（结果）{ //联合新用户 }）; }）;

Answer 2

以下代码可以解决问题：

$scope.fetch = function() {
    // Use User.query().$promise.then(...) to parse the results
    User.query().$promise.then(function(result) {
        for(var i in result) {
            // There is more data in the result than just the users, so check types.
            if(result[i] instanceof User) {
                // Never concat and set the results, just append them.
                $scope.users.push(result[i]);
            }
        }
    });
};

window.addEventListener('scroll', function(event) {
    if (document.body.offsetHeight < window.scrollY +
            document.documentElement.clientHeight + 300) {
        $scope.fetch();
    }
}, false);

从restful api向angularjs范围添加新数据

2 个答案: