1
Reply

AngularJS: infinite scroll with ng-repeater

tri_inn

tri_inn

Jun 13 2017 10:49 AM
232
i am new in angular. so hopping many site to read nice article on angular code example. so today i visited a site http://www.dotnetawesome.com/2016/03/infinite-scroll-for-facebook-like-pagination-angularjs.html

which come with a example like how to create infinite scroll with angularJS.

here i will post some question which is not clear to me. so please answer and guide about those syntax and code in the article because i need to understand.

1) there is one function called NextPage() which the function name has been assign with directive name like this way
  1. <div infinityscroll="NextPage()" style="height:400px; overflow:auto;"> ? 

  1. $scope.NextPage = function () {  
  2. if ($scope.CurrentPage < $scope.TotalPage) {  
  3. $scope.CurrentPage += 1;  
  4. GetEmployeeData($scope.CurrentPage);  
  5. }  


tell me what does it mean to assign function name with directive name

<div infinityscroll="NextPage()" style="height:400px; overflow:auto;"> ?

does it mean when directive will load then the NextPage() function will be called or it has different meaning ?

2) see the directive code first
  1. app.directive('infinityscroll', function () {  
  2. return {  
  3. restrict: 'A',  
  4. link: function (scope, element, attrs) {  
  5. element.bind('scroll', function () {  
  6. if ((element[0].scrollTop + element[0].offsetHeight) == element[0].scrollHeight) {  
  7. //scroll reach to end  
  8. scope.$apply(attrs.infinityscroll)  
  9. }  
  10. });  
  11. }  
  12. }  
  13. }); 

what is the meaning of this line scope.$apply(attrs.infinityscroll)

hence i am new so i am fumbling when reading article on angular js v1+. so please answer my 2 questions in details to guide me. thanks

Answers (1)