AngularJS无限滚动嵌套对象

2017-02-21 100 views -1 likes

-1

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

<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和嵌套对象一起使用的任何示例。

来源

2017-02-21 plamen tassev

回答

考虑到您拥有固定数量的部门和员工，您是否真的需要无限滚动？我没有任何无限滚动的经验，但我想你可以用正常的滚动来试试:)。

来源

2017-02-21 14:51:44 Dax

我需要在页面上无限滚动。（必须在视图结束后旋转视图，这是一项要求）。 –

如果使用嵌套对象，我们需要滚动外部对象。没有嵌套的循环应该是必要的。注意“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); 

    } 
};

来源

2017-02-21 19:22:19

AngularJS无限滚动嵌套对象

回答

相关问题