how implement infine scroll json data large file. have bit of trouble creating infinite scroll in angularjs json file generated on external site. how infinite scroll work relative inner content div scrollbar? below code
<!doctype html> <html lang="en"> <head> <title></title> <meta charset="utf-8" /> <link rel="stylesheet" href="style.css" type="text/css" /> <link rel="stylesheet" href="table.css" type="text/css" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(window).resize(function() { if ($(window).width() < 960) { window.location = "http://www.stackoverflow.com"; } else { window.location = "http://www.google.com"; } }); </script> <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> </head> <body class="body" ng-app="myapp" ng-controller="customersctrl"> <header class="mainheader"> <nav> <ul> <li class="active"><a href="#">sokranti data analytics</a></li> </ul> </nav> </header> <div class="maincontent"> <div class="content"> <article class="topcontent"> <content> <div class="mytable"> <table > <tr> <td>eng_rev_type</td> <td>year_start</td> <td>year_end</td> <td>type</td> <td>amount</td> </tr> <tr ng-repeat="x in names | filter:test"> <td>{{ x.eng_rev_type }}</td> <td>{{ x.year_start }}</td> <td>{{ x.year_end }}</td> <td>{{ x.type }}</td> <td>{{ x.amount }}</td> </tr> </table> </div> </content> </article> </div> <aside class="top-sidebar"> <article> <h2>filter</h2> <p><input type="text" ng-model="test"></p> </article> </aside> </div> <footer class="mainfooter"> <p>copyright © 2015 <a href=""></a></p> </footer> <script> var app = angular.module('myapp', []); app.controller('customersctrl', function($scope, $http) { $http.get("data.json") .success(function (response) {$scope.names = response.data;}); }); </script> </body> </html>
you can create directive bind on scroll event. can increase size of scroll height.
Comments
Post a Comment