Angular JS loading issue

Question

I am trying to get the following Angular-Spinner working in my project:

I am trying to get it working with http.get calls. So far I have:

in controllers:

$scope.loading = true;
$http.get('js/data/test.json').success(function(results){
$scope.section = results.section;
$scope.loading = false;

});

In the view:

<span us-spinner="{radius:15, width:4, length: 8}" ng-show="loading"></span>
<div ng-repeat="post in section" class="inner"></div>

Currently the loading shows very fast, I want to know is this the correct way to use it? How can I delay it slightly before all the data loads and a spinner is shown. Any ideas?

cdslijngard · Accepted Answer · 2016-02-05 14:41:08Z

1

You could try to add a timeout:

$scope.loading = true;

setTimeout(function () {
    $http.get('js/data/test.json').success(function(results){
        $scope.section = results.section;
        $scope.loading = false;
    }
}, 5000);

This will wait 5 seconds before trying to retrieve the data from the JSON file.

EDIT: use the $timeout service from Angular. Don't forget to include it in your controller! (Thank you Walfrat)

$timeout(function () {
    $http.get('js/data/test.json').success(function(results){
        $scope.section = results.section;
        $scope.loading = false;
    }
}, 5000);

edited Feb 5, 2016 at 14:41

answered Feb 5, 2016 at 14:34

cdslijngard

1961 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Walfrat Over a year ago

even better : use $timeout of angular.

deceze Over a year ago

Of course, delaying a data load for 5 seconds for no real reason is... questionable at best.

rob Over a year ago

@ deceze, I dont want to delay it 5 seconds but if you look at the original question the data is coming through too quick whether I am using it correct or not

deceze Over a year ago

@rob Yeah, I'm not sure what you're asking exactly in the first place. You're saying the spinner never really shows up because the data is loaded too fast? Well... that's a good problem to have, I'd think...?

cdslijngard Over a year ago

Can you try to elaborate? I think I answered your question perfectly; at least I think I interpreted it correctly.

Collectives™ on Stack Overflow

Angular JS loading issue

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related