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

考慮到您擁有固定數量的部門和員工，您是否真的需要無限滾動？我沒有任何無限滾動的經驗，但我想你可以用正常的滾動來試試:)。

Answer 2

如果使用嵌套對象，我們需要滾動外部對象。沒有嵌套的循環應該是必要的。注意「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); 

    } 
};