CODEWITHSUNDEEP
htmlangularjs
BrMe
BrMe

Reputation: 315

Display data that already loaded Angular JS

I have an chtml page using Angular Js that contains list with objects from database but it takes a long time to load the data. how can I load just 10 objects and display them, and than continue to load the data and show the rest of data in Angular Js????

Upvotes: 0

Views: 469

Answers (1)

Mathew Berg
Mathew Berg

Reputation: 28750

It sounds like you have a lot of data that you want to slowly load to the front end so you don't have to wait. The only method I can think of for adding data periodically would be a setInterval.

the key would be to create a new variable

$scope.displayObjects = []

That you could contiously append to like so

for(var x = currentIndex; x < currentIndex + step && x < $scope.objects.length; x++){
    $scope.displayObjects.push($scope.objects[x]);                        
}

Then just set up an interval to continuously call that. You will also need to make use of 

$scope.$apply()

to tell angular to re-apply itself (http://docs.angularjs.org/api/ng.$rootScope.Scope#$apply).

http://jsfiddle.net/A9uND/20/ You can adjust how much it loads with each step via the step variable.

Next time include a jsfiddle (or something similar) so it's easier to assist you.

While the method outlined above will work, I would suggest tracking how much you can see and then only loading the relevant ones. As you scroll add more along the way.

Upvotes: 1

Related Questions