angularjs - AngularJS无限滚动嵌套对象

Question

我可以对嵌套对象使用无限滚动吗？假设我们有 3 个部门，每个部门有 10 名员工。这是一个示例代码：

<div infinite-scroll="$ctrl.scroll()">
    <div ng-repeat="department in $ctrl.departments">
         /* display data here */
         <div ng-repeat="employee in $ctrl.employees">
         /* display data here */
         </div>
    </div>
</div>

这是js代码：

this.scroll = function() {
    console.log("Infinite Scroll Triggered");
    for(var i = 0; i < 3; i++) {
        console.log("pushing " + this.departments[i].name); 
        this.departments.push(this.department[i]);

        for(var j = 0; j < 10; j++){
               console.log("pushing " + this.employee[i].name);
               this.employees.push(this.employee[i]);
         }
};

我可以在控制台上看到我正在向部门和员工推送，但页面没有刷新。我也找不到任何将 ng-scroll 与嵌套 ng-repeat 和嵌套对象一起使用的示例。

Answer 1

如果使用嵌套对象，我们需要在外部对象上滚动。不需要嵌套循环。注“ track by $index”。

html代码：

<div infinite-scroll="$ctrl.scroll()">
    <div ng-repeat="department in $ctrl.departments track by $index">
         /* display data here */
         <div ng-repeat="employee in $ctrl.employees">
         /* display data here */
         </div>
    </div>
</div>

js代码：

this.scroll = function() {

    for(var i = 0; i < 3; i++) { 

        var departmentToPush= this.department[i];

        this.departments.push(departmentToPush);

    }
};

Answer 2

考虑到你有固定数量的部门和员工，你真的需要无限卷轴吗？我对无限滚动没有任何经验，但我想您可以尝试使用普通滚动:)。