Javascript 这个示例AngularJS无限滚动是如何工作的

我在搜索AngularJS脚本时发现了这个示例，但是我似乎无法理解代码中的angular模块和指令部分。虽然我已经成功地编辑了loadMore（）函数，从我的ReSTful API中检索json资源，并且它与无限滚动非常配合，但请有人解释一下它是如何工作的，我将非常感激。在过去一周的业余时间里，我刚刚开始阅读和尝试AngularJS

fiddle原创（对原创作者的衷心感谢）：

---

我要试试这个：

该指令返回一个link函数，该函数将为该指令的每个实例调用。因此，它将在加载时执行，并在每个列表项上附加一个滚动事件处理程序。如果高度计算为true，则它将附加一个属性“whenscroll”，该属性是当前li的一个指令，并强制Angular重新编译DOM，这将处理新的指令，该指令将调用loadMore（），向列表中添加更多项

---

需要应用，因为Angular不会处理列表项上新添加的指令，并且不会添加滚动处理程序。

您最不清楚的部分/代码是什么？整个Angular.module whenScrolled指令位。无限卷轴是如何工作的…谢谢你的回答。你的解释对我来说很清楚，我就快明白了。但是，请您也解释一下返回函数（scope、elm、attr）上的参数，以及它的用途和使用方法。我接受了您的回答，因为您以我理解的方式解释了它，也帮助我找到了正确的方向。谢谢

function Main($scope) {
    $scope.items = [];

    var counter = 0;
    $scope.loadMore = function() {
        for (var i = 0; i < 5; i++) {
            $scope.items.push({id: counter});
            counter += 10;
        }
    };

    $scope.loadMore();
}

angular.module('scroll', []).directive('whenScrolled', function() {
    return function(scope, elm, attr) {
        var raw = elm[0];

        elm.bind('scroll', function() {
            if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight) {
                scope.$apply(attr.whenScrolled);
            }
        });
    };
});

function Main($scope, $http) {

    $scope.phones = [];

    $scope.loadMore = function() {
        $http.get('http://www.somewhere.com/api/phones').success(function(data) {
            if($scope.phones.length > 0) {
                $scope.phones = $scope.phones.concat(data);
            }
            else {
                $scope.phones = data;
            }
        });
    };

    $scope.loadMore();
}