pagination like facebook infinite scroll using angularjs
Hey guys, today we are going to discuss about infinite scroll pagination which gaint platform likes facebook, twitter, instagram does. And developers face alot problem to achieve this task, Since I myself got the solution after long research. Today I will show you to do in very easier way.
For understanding purpose we will take a small example so that things could be clear easily. So in this demo we are not going to use and database of any json data. we are going to achive this be showing it with increamental value upto 1000. Means infinite scroll will go till 1000.
So lets have a look on our view part. index.html
In the above html file, we have included angular app and a controller within that app. Below that we have a normal table where 20 records load at first then further records loads( after calling method loadMore()) as per the scroll with the help of angular & its modules.
Now have a look on angular part. app.js
In the above js file we have created an app included 'infinite-scroll' , Below that we have created a loop which will run till 1000 which is our max limit to show the record. And at the bottom we have created a method loadMore which calls on page scroll and push the next data into the existing view of the page.
In this easiest way we can perform the task which looks a big task itself.
Pretty cool! Finally, our task completes here.
That’s all for now. Thank you for reading and I hope this post will be very helpful.
Let me know your thoughts over the email firstname.lastname@example.org. I would love to hear them and If you like this article, share with your friends.
You can download complete code from here. Download Code