infinite-scroll

I am trying to add an infinite scroll with ngx-infinite-scroll in my Angular 4 project. The array data has about 800 posts which are from API. Initially, I want to display 20 posts and every single time the page is scrolled, it will display 20 more posts. Currently, I can see the console log message (scrolled!) whenever I scroll down. But I can't figure out how to append 20 posts into the table when it's scrolled. This is the codes that I am trying. onScrollDown function onScrollDown(){ this.dataService.getPosts().subscribe((posts)=>{ for (let post of posts){ let data = '<tr><td>'+ post.title

I've been implementing Infinite-Scroll by Paul Irish on my site. It works on desktop browsers, but on mobile (iPhone specifically) it doesn't straight away. The work around is zooming in slightly, that makes the scroll event fire which triggers infinite scroll. Also see the issue report here: https://github.com/paulirish/infinite-scroll/issues/3 My question is: is there a solution for this? I've noticed Tumblr makes infinite-scroll work without a workaround. If you were to check http://youworkit.tumblr.com/ on iPhone, then switch from the mobile to the standard desktop view, infinite-scroll

I have an array of articles in my Model and they are rendered nicely as HTML. What I want is to add some new articles when the user scrolls to the end of the page. I achieved this, but in my opinion with some really hacky behavior: all I have done is added jquery event handler $(window).scroll , like this: function ArticlesViewModel() { var self = this; this.listOfReports = ko.observableArray([]); this.loadReports = function() { $.get('/router.php', {type: 'getReports'}, function(data){ self.listOfReports(self.listOfReports().concat(data)); }, 'json'); }; this.loadReports(); $(window).scroll

I've been using JQuery masonry and now I'm adding infinite scroll. There are images in nearly every masonry "brick" and before I was using infinite scroll the images loaded fine and everything was great. I added the next part of the javascript for the infinite scroll and added the imagesLoaded method inside but when the new bricks are appended they come out all piled on top. My assumption is that I am not adding the imagesLoaded method properly in the infinite scroll callback but I haven't been able to find my error. Here's the code <script type="text/javascript"> $(function(){ var $container

I am working on a project that uses the jQuery Masonry and Infinite Scroll plugins to load "n" amount of pictures from instagram using their API. Looking at this short example my understanding is that I need to have before hand the html pages to be rendered: <nav id="page-nav"> <a href="pages/2.html"></a> </nav> The problem is, I dont really know how many pictures will be retrieved. Here is for example how I retrieve 20 pics at a time. $(document).ready(function(){ var access_token = location.hash.split('=')[1]; if (location.hash) { $.ajax({ type: "GET", dataType: "jsonp", cache: false, url:

I have a month view similar to the iOS calendar and an UICollectionView is used. Now it would be interesting to implement an infinite scrolling behavior so that the user can scroll in each direction vertically and it will never end. The question now is how can such a behavior be implemented in an efficient way? This is what I've found out now: Basically you can check if you hit the end of the current scroll view. You can check this in scrollViewDidScroll: or in collectionView:cellForItemAtIndexPath: . It would be simple to add another content to the datasource, but I think there is more than

Okay, the code below "works" in that when you scroll to the bottom of the page the AJAX function is fired and results are appended to the #postswrapper div on the page. The issue is: if I scroll really quickly when I reach the bottom of the page, the AJAX fires several times and loads several sets of results into the #postswrapper div (number of additional, 'unwanted' results are determined by how many additional scroll events were fired by scrolling quickly). Ultimately, I need only serve one set of results per time the user reaches the bottom. I've tried adding timers and such, but to no